前文我们写过一篇文章：[ri-post id=”2724″ thumb=”none”] 本文我们再来介绍一下，如何在安装了 emmet插件的notepad++编辑器中快速编辑代码。所谓快速，只是针对常用的html代码标签而言。下面就一起来看看常用的快速编辑简码。

一、html5 ： 输入一个 !  或 html:5  ，就可输出如下代码：

<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>

二、html4 ： 输入html:4s

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body>
</body>
</html>

三、其它常用标签

缩写：a:link <a href="http://"></a>
缩写：link <link rel="stylesheet" href="" />
缩写：link:css <link rel="stylesheet" href="style.css" />
缩写：link:print <link rel="stylesheet" href="print.css" media="print" />
缩写：link:favicon <link rel="shortcut icon" type="image/x-icon" href="favicon.ico" />
缩写：meta:utf <meta http-equiv="Content-Type" content="text/html;charset=UTF-8" />
缩写：script:src <script src=""></script>
缩写：form:post <form action="" method="post"></form>
缩写：input:h <input type="hidden" name="" />
缩写：input:t <input type="text" name="" id="" />
缩写：input:email <input type="email" name="" id="" />
缩写：input:url <input type="url" name="" id="" />
缩写：input:p <input type="password" name="" id="" />
缩写：input:c <input type="checkbox" name="" id="" />
缩写：input:f <input type="file" name="" id="" />
缩写：input:s <input type="submit" value="" />

四、常规语法：

1、后代：>     缩写：nav>ul>li

<nav>
<ul>
<li></li>
</ul>
</nav>

2、兄弟：+    缩写：div+p+bq

<div></div>
<p></p>
<blockquote></blockquote>

3、分组：()     缩写：div>(header>ul>li*2>a)+footer>p

<div>
<header>
<ul>
<li><a href=""></a></li>
<li><a href=""></a></li>
</ul>
</header>
<footer>
<p></p>
</footer>
</div>

4、乘法：*   缩写：ul>li*5

<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>

5、ID和类属性

缩写：#header <div id="header"></div>
缩写：.title <div class="title"></div>
缩写：form#search.wide <form id="search" class="wide"></form>
缩写：p.class1.class2.class3 <p class="class1 class2 class3"></p>

以上是我在使用notepad++快速编辑插件时所经常使用到的快捷方法，使用它们可以大大地节省我们在编辑html代码的时间，有效提升我们的编程效率。

 

声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。