我们在写前端的时候,面对重复代码的时候,很多时候就会复制粘贴,实际上可以通过技巧来提高写前端的效率。接下来将介绍几个常用的提高效率的技巧
目录
- 注释
- 乘法
- 后代
- 兄弟
- 上级
- 分组
- 自增
- ID和类
- 自定义属性
- 文本
- 隐式标签
注释
输入以下代码
复制代码
1
2Ctrl+/
另外,取消注释也是Ctrl+/
乘法
*
输入以下代码
复制代码
1
2(div>ul>li)*5
后代
>
输入以下代码
复制代码
1
2nav>ul>li
兄弟
+
输入以下代码
复制代码
1
2div+p+bq
上级
^
输入以下代码
复制代码
1
2div+div>p>span+em^bq
输入以下代码
复制代码
1
2div+div>p>span+em^^bq
分组
()
输入以下代码
复制代码
1
2(div>dl>(dt+dd)*3)+footer>p
自增
$
输入以下代码
复制代码
1
2ul>li.item$*5
倒序的
复制代码
1
2ul>li.item$@-*5
编号为3位数字
复制代码
1
2ul>li.item$$$*10
自增从5开始,输出10条
复制代码
1
2ul>li.item$@5*10
ID和类
#和.
复制代码
1
2#header
复制代码
1
2.title
复制代码
1
2form#search.wide
自定义属性
[]
复制代码
1
2p[title="Hello world"]
多个属性的情况
复制代码
1
2td[rowspan=2 colspan=3 title]
文本
{}
复制代码
1
2a{Hello world}
复制代码
1
2p{段落内容}
再按 Tab键(下同)
例如:
隐式标签
复制代码
1
2.class
复制代码
1
2em>.class
复制代码
1
2ul>.class
复制代码
1
2table>.row>.col
还有很多,所有未知的缩写都会转换成标签————》详细戳https://docs.emmet.io/cheat-sheet/
https://blog.csdn.net/hanhanwanghaha宝藏女孩 欢迎您的关注!
欢迎关注微信公众号:宝藏女孩的成长日记
如有转载,请注明出处(如不注明,盗者必究)
最后
以上就是无奈菠萝最近收集整理的关于如何提高写前端的效率?干货,快进!的全部内容,更多相关如何提高写前端内容请搜索靠谱客的其他文章。
本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
发表评论 取消回复