文档章节

工欲善其事必先利其器(二)

行者问行
 行者问行
发布于 2016/11/02 01:01
字数 665
阅读 10
收藏 0

 

写在前面的话:目前我已使用过的前端编辑软件有DW.HBuilder和sublime。总结来说,DW对于对表格和表单不太熟练的同学来说,使用比较方便,更适合初学者;HBuilder算是比较完美的了,对于前端这一块来说,有一个很好的功能是:可以把项目中的已使用过的内容提示出来,这样有一点比较好,避免命名重复的类或者id。缺点是:启动速度比较慢,不过一直在更新,而且是国产的,不用安装各种插件,对中国人比较友好;Sublime开启速度比较快,但是要安装一堆的插件,也没有像HBuilder那样强大的提示功能。总的来说,这三个各有千秋,看使用者爱好喽。

说了那么多废话,下面进入正题:

Emmet  语法:

1.后代: >
缩写: nav>ul>li

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

2.兄弟: +
缩写:div+p+a

<div></div>
<p></p>
<span></span>

3.上级: ^
缩写:div+div>p>span+em^strong

<div></div>
<div>
	<p><span></span><em></em></p>
	<strong></strong>
</div>

缩写:div+div>p>span+em^^strong

<div></div>
<div>
    <p><span></span><em></em></p>
</div>
<strong></strong>

4.分组:()

缩写: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>

缩写:(div>dl>(dt+dd)*3)+footer>p

<div>
	<dl>
		<dt></dt>
		<dd></dd>
		<dt></dt>
		<dd></dd>
		<dt></dt>
		<dd></dd>
	</dl>
</div>
<footer>
	<p></p>
</footer>

5.乘法:*

缩写:ul>li*5

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

6.自增符号:$

默认是递增,@-是递减,@3是从3开始递增

缩写:ul>li.item$*3

<ul>
	<li class="item1"></li>
	<li class="item2"></li>
	<li class="item3"></li>
</ul>

缩写:h$[title=item$]{Header $}*3

<h1 title="item1">Header 1</h1>
<h2 title="item2">Header 2</h2>
<h3 title="item3">Header 3</h3>

缩写:ul>li.item$$$*5

<ul>
	<li class="item001"></li>
	<li class="item002"></li>
	<li class="item003"></li>
</ul>

缩写:ul>li.item$@-*5

<ul>
	<li class="item3"></li>
	<li class="item2"></li>
	<li class="item1"></li>
</ul>

缩写:ul>li.item$@3*5

<ul>
	<li class="item3"></li>
	<li class="item4"></li>
	<li class="item5"></li>
</ul>

7.ID和类属性

缩写:form#search.wide

<form action="" id="search" class="wide"></form>

缩写:p.class1.class2.class3

<p class="class1 class2 class3"></p>

8.自定义属性

缩写:p[title="Hello world"]

<p title="Hello world"></p>

缩写:td[rowspan=2 colspan=3 title]

<td rowspan="2" colspan="3" title=""></td>

缩写:[a='value1' b="value2"]

<div a="vale1" b="value2"></div>

9.文本

缩写:p>{Click }+a{here}+{ to continue}

<p>Click<a href="">here</a>to continue</p>

10.隐式标签

缩写:.class

<div class="class"></div>

缩写:em>.class

<em><span class="class"></span></em>

缩写:ul>.class

<ul>
	<li class="class"></li>
</ul>

缩写:table>.row>.col

<table>
	<tr class="row">
		<td class="col"></td>
	</tr>
</table>

 

本文转载自:http://www.w3cplus.com/tools/emmet-cheat-sheet.html

行者问行
粉丝 1
博文 13
码字总数 5075
作品 0
郑州
前端工程师
私信 提问
1、C语言 —— Hello World

一、工欲善其事,必先利其器。咱们要神器Xcode来进行C语言学习。 (可在App Store中下载,也可在迅雷的Thunder Store中下载) 二、点击Xcode,选择“Create a new Xcode project”,意思你我...

cobish
2014/03/16
0
0
工欲善其事,必先利其器,你有哪些好的职场工作工具?那些缺的,给位补充下

工欲善其事,必先利其器,你有哪些好的职场工作工具? 1.找人利器:脉脉,LinkedIn等 2.查企业信息:企查查,天眼查,企业信用网等 3.CRM软件:纷享销客,销售易等 4.通讯录:名片全能王等 5.记录...

没有初恋
2017/07/19
97
3
OC Xcode 注释插件VVDocumenter-Xcode

题记:工欲善其事必先利其器 VVDocumenter-Xcode 是款很好用的注释插件 安装操作步骤如下: 下载VVDocumenter-Xcode.zip包 https://github.com/onevcat/VVDocumenter-Xcode 解压后(本机mac...

卧龙小
2014/10/29
0
0
Android开发和分析工程师的利器【来自网易内部工具】

“工欲善其事,必先利其器”,为了提高Android开发和分析的效率,为大家介绍一款Windows下的右键工具,主要功能包括:dex转jar,二进制xml查看,apk相关信息查询,apk图标提取,apk优化,手机...

网易云捕
2016/04/08
188
0
flowable设计器插件安装

原文地址:http://www.shareniu.com/ 工欲善其事必先利其器,要想使用flowable,必须搭建一套环境,本文以Eclipse中安装flowable插件为例详细说明整个安装过程。 首先,打开Eclipse,HelpàI...

分享达人
2017/01/18
0
0

没有更多内容

加载失败,请刷新页面

加载更多

小白讲网络安全系列

注入攻击防护 XSS注入 SQL注入 命令注入 文件上传 文件解压缩 CSRF防护 对称加密 非对称加密 数字证书 数字签名 完整性校验 消息验证码 单向散列Hash函数 口令单向加密算法 审计日志 认证鉴权...

一刀
今天
2
0
MYSQL 嵌套事务(SAVEPOINT) 与Spring 事务传播

摘要 savepoint 关键字可以实现嵌套事务。结合savepoint关键字,更方便理解spring的事务传播。 事务嵌套 初始化表脚本 drop table t;create table t(a int, primary key(a)); 开启事务 my...

liangxiao
今天
3
0
Chrome OS 更新新版本可让Linux访问USB连接的Android设备

谷歌再次为Chrome OS带来了重大版本更新,使版本号达到了75。本次更新的一大亮点就是允许在Chrome OS上运行的Linux能够识别通过USB方式连接的Android设备,能够让用户使用Linux进行调试等等。...

linuxCool
昨天
15
0
聊聊feign的HystrixInvocationHandler

序 本文主要研究一下feign的HystrixInvocationHandler HystrixInvocationHandler feign-hystrix-10.2.3-sources.jar!/feign/hystrix/HystrixInvocationHandler.java final class HystrixInvo......

go4it
昨天
17
0
WPS 开启宏功能

前言 最近安装了个人版的WPS2019,使用Excel的宏功能时候发现不能使用了,网上下载了几个安装包都是比较旧的,不能使用。 找了个VB7.1的安装包,安装完了,重启WPS宏功能就可以使用了。 安装...

sharelocked
昨天
4
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部