Notepad++ 安装 Zen Coding / Emmet 插件
Zen Coding 插件
==============
下载: Zen.Coding-Notepad++.v0.7.zip
==Installation==
1. Copy contents of this archive into Notepad++ 'plugins' folder (basically, it's C:\Program Files\Notepad++\plugins\)
2. Restart Notepad++
You should see "Zen Coding" menu item in top menu.
安装: 解压压缩包, 复制相应文件(NppScripting.dll及NppScripting文件夹)到Notepad++安装目录下的plugins文件夹下
---------------------------------------------------------------------------------------------------
Emmet 插件
============
zen-Coding改名Emmet,网站:docs.emmet.io
https://github.com/emmetio/npp#readme
Emmet is a web-developer’s toolkit that can greatly improve your HTML & CSS workflow:
write HTML code with CSS-like abbreviations, use different actions to quickly select and modify HTML and CSS code and more!
==Installation==
Plugin manager
This plugin is available via Plugin Manager: use Plugins > Plugin Manager > Show Plugin Manager menu action and find and install “Emmet” plugin.
Manual installation
1.Install Python Script plugin (available in Plugin Manager).
(可以通过Notepad++的Plugin安装Python Script
或直接下载:PythonScript_1.0.8.0.msi进行安装)
2.Download EmmetNPP pluginand unpack it into C:\Program Files\Notepad++\plugins folder Start Nodepad++.
You should see Plugins > Emmet menu item.
==Changing keyboard shortcuts==
You can use default Settings > Shortcut Mapper… dialog to change action’s keyboard shortcuts.
plugin commands 》Expand abbreviation
Try to map Tab key to Expand Abbreviation action to improve your experience.
Extensions support
Emmet for Notepad++ supports extensions:
put all your .js and .json files into %USER%\AppData\Roaming\Notepad++\plugins\config\emmet folder and restart Notepad++.
---------------------------------------------------------------------------------------------------
如果遇到:
Unknown exception
Python Script Plugin did not accept the script
http://sourceforge.net/projects/npppythonscript/files/Python%20Script%201.0.8.0/PythonScript_1.0.8.0.msi/download
----------------------------------------------------------------------------------------------------
Notepad++插件快捷键设置
!
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body> </body>
</html> 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> html:xs <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>Document</title>
</head>
<body> </body>
</html> #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)*3)+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)*3)+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>{我是链接标题}
<a href="">我是链接标题</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>
$ 就表示一位数字,只出现一个的话,就从1开始。如果出现多个,就从0开始。如果我想生成三位数的序号,那么要写三个 $: 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
<header>
<ul class="nav">
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</ul>
</header>
<article></article>
<footer></footer>
Notepad++ 安装 Zen Coding / Emmet 插件的更多相关文章
- Notepad++安装Zen Codingt插件
Zen Coding介绍 Zen Coding是一套面向文本编辑器的插件,它允许通过IDE工具的联想功能(内容辅助)高速度的编辑HTML.XML.XSL和其他结构化的代码格式. Zen Coding由 ...
- notepad++ 安装 hex_editor 十六进制查看插件
1.到 https://github.com/chcg/NPP_HexEdit/releases 去下载相应的文件,注意32位和64位的区别 2.点击notepad++的设置--->导入--&g ...
- Notepad++快捷键&正则表达式替换字符串&插件
Notepad++绝对是windows下进行程序编辑的神器之一,要更快速的使用以媲美VIM,必须灵活掌握它的快捷键,下面对notepad++默认的快捷键做个整理(其中有颜色的为常用招数): 1. 文件 ...
- vim 中 也可以 直接安装 emmet 直接使用zen coding 生成 l指定个数的 lorem ipsum文字.
超链接的写法: 当作为链接的文字, 比较长时, 整个作为链接 就显得不是 很适合. 可以取其中的某一个单词 作为 超链接的 关键字:如: click here to continue emmet中如何 ...
- 使用Emmet(前身Zen Coding)加速Web前端开发
Emmet插件以前被称作为Zen Coding,是一个文本编辑器的插件,它可以帮助您快速编写HTML和CSS代码,从而加速Web前端开发.早在2009年,Sergey Chikuyonok写过一篇文章 ...
- sublime text 2 安装emmet插件
一.添加插件之前先 下载Package Control 按 Ctrl+`(就是~这个键) 复制下面的代码 确认 重新启动sublime text2 import urllib2,os;pf='Pack ...
- 再说vundle: 完全vim字符编程的四个必须插件 - zen coding 和emmet插件的使用
一个常识: 基本上vim插件的配置文集都是放在对应插件目录 的/autoload/ plugin_name.vim 文件中的 有四个必要/必须的插件,实现vim完全的字符界面的编程: NERDTree ...
- Sublime Text2安装emmet(原名Zen Coding)总结
首先,安装好Sublime( 我用的是版本号2),之后注冊好.Sublime Text2.0.2注冊码:http://xionggang163.blog.163.com/blog/static/376 ...
- 如何在Notepad++ 中成功地安装Emmet 插件
对于前端来说,Emmet 是一个好东西,但是好几次在 “Notepad++” 中安装后不能使用.今天认认真真地查找了失败原因,配置完成后,终于可以在 “Notepad++” 下正常使用了.故把过程记录 ...
随机推荐
- python cassandra 创建space table并写入和查询数据
from cassandra.cluster import Cluster cluster = Cluster(["10.178.209.161"]) session = clus ...
- hdu-5666 Segment(俄罗斯乘法or大数乘法取模)
题目链接: Segment Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/65536 K (Java/Others) P ...
- 数据表示Numpy
1 基本 1.1 基本介绍 掌握表示, 清洗, 统计和展示数据的能力 Numpy, Matplotlib, Pandas, Projects 摘要: 有损的提取数据特征的过程 可以将一组数据, 摘要出 ...
- css font-family(字体样式)
之前因为用的很少,所以没注意,最近做APP混合开发, 给字体一个样式 font-family:" 微软雅黑": 发现在有的手机上有效,但是在有的手机上是无效的, 解决方法: ...
- nohup command > myout.file 2>&1 &
nohup command > myout.file 2>&1 &
- dubbo框架介绍
1.背景 (#) 随着互联网的发展,网站应用的规模不断扩大,常规的垂直应用架构已无法应对,分布式服务架构以及流动计算架构势在必行,亟需一个治理系统确保架构有条不紊的演进. 单一应用架构 当网站流量很小 ...
- 1.6-1.8 HBase表的物理模型
一.HBase 物理模型 1. 1.Table中的所有行都按照row key的字典序排列: 2.Table在行的方向上分割为多个Region: 3.Region按天小分割的,每个表开始只有一个regi ...
- 20个Flutter实例视频教程-第06节: 酷炫的路由动画-2
博客地址: https://jspang.com/post/flutterDemo.html#toc-94f 视频地址: https://jspang.com/post/flutterDemo.htm ...
- Flutter实战视频-移动电商-24.Provide状态管理基础
24.Provide状态管理基础 Flutter | 状态管理特别篇 —— Provide:https://juejin.im/post/5c6d4b52f265da2dc675b407?tdsour ...
- UVaLive 3695 Distant Galaxy (扫描线)
题意:给平面上的 n 个点,找出一个矩形,使得边界上包含尽量多的点. 析:如果暴力那么就是枚举上下边界,左右边界,还得统计个数,时间复杂度太高,所以我们考虑用扫描线来做,枚举上下边界, 然后用其他方法 ...