Emmet's predecessor is the famous Zen Coding,web front-end development, the plugin must not be unfamiliar. It uses the syntax of the faux CSS selector to generate code, greatly improving the speed of HTML/CSS code writing.
For example, notepad++ quickly write HTML code-the initialization of an HTML document needs to include some fixed tags, such as
Emmet requires support for Python Script, so these two plugins must be installed for use at the same time. There are two ways to install the method according to the official tutorial.
The first type: Install with plugin manager, open plugin-plugin manager-Show plugin to find Emmet plug-in installation
The second type: Manual method.
Install the Python Script plugin first (python script:a python Scripting plugin for notepad++), which the official tutorial says can be installed in the Plugins manager. Download the Emmet plugin, unzip to the \program Files\notepad++\plugins installation directory, start notepad++ to see the Emmet plugin. Plugin Address: HTTPS://GITHUB.COM/EMMETIO/NPP
The official recommendation is to set the shortcut key abbreviation to tab.
However, the cows found that the above method was not feasible during installation because the plug-in did not work at all. There are unknown exception and Python script plugin did not accept the script error prompt, the environment is Win7 x64 bit system, find a solution is Python script plugin problem, download Python Sc ript Plugin reinstallation resolves this issue.
Plug-in Introduction and installation address: http://npppythonscript.sourceforge.net/download.shtml
Uninstall the original Python script plugin before installing again.
notepad++ Plugin shortcut key settings
!
<!doctype html>
<meta charset= "UTF-8" >
<title>Document</title>
<body>
</body>
Html:4s
<! DOCTYPE HTML PUBLIC "-//w3c//dtd HTML 4.01//en" "HTTP://WWW.W3.ORG/TR/HTML4/STRICT.DTD" >
<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >
<title>Document</title>
<body>
</body>
Html:xs
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 strict//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd" >
<meta http-equiv= "Content-type" content= "Text/html;charset=utf-8" >
<title>Document</title>
<body>
</body>
#content. aticle.posts
<div id= "Content" class= "aticle posts" ></div>
Ul#ccc.ddd
<ul id= "CCC" class= "DDD" >
</ul>
Div.aaa>ul>li
<div class= "AAA" >
<ul>
<li></li>
</ul>
</div>
Div>ul>li^^span
<div>
<ul>
<li></li>
</ul>
</div>
<span></span>
Div>ul>li^^div.clear
<div>
<ul>
<li></li>
</ul>
</div>
<div class= "Clear" ></div>
Div>ul>li*6
<div>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</div>
(Div>dl> (DT+DL)) +footer>p
<div>
<dl>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
</dl>
</div>
<footer>
<p></p>
</footer>
Div.banner>ul>li*2> (DT+DL) +footer^^span
<div class= "banner" >
<ul>
<li>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
<footer></footer>
</li>
<li>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
<dt></dt>
<dl></dl>
<footer></footer>
</li>
</ul>
<span></span>
</div>
A
<a href= "" ></a>
a>{I am the link title}
<a href= "" > I am the link title </a>
Link
<link rel= "stylesheet" href= "" >
Ul>li.item$*5
<ul>
<li class= "Item1" ></li>
<li class= "Item2" ></li>
<li class= "Item3" ></li>
<li class= "Item4" ></li>
<li class= "ITEM5" ></li>
</ul>
$ means one digit, and only one appears, starting with 1. If more than one appears, start at 0. If I want to generate a three-digit ordinal number, then write three $:
Ul>li.item$$*5
<ul>
<li class= "ITEM01" ></li>
<li class= "ITEM02" ></li>
<li class= "Item03" ></li>
<li class= "Item04" ></li>
<li class= "Item05" ></li>
</ul>
(header>ul.nav>li*5) +article+footer
<ul class= "NAV" >
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
<article></article>
<footer></footer>
notepad++ Emmet Installation Method tutorial
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
