VScode的小tip之Emmet语法

Emmet语法的前身是Zen coding,它用来缩写,来提高html/css的编写速度,Vscode内部已经集成该语法

快速生成HTML结构语法

1.生成标签 直接输入标签名按tab键即可 比如 div 然后tab键,就可以生成<div></div>.

2.如果想要生成多个相同标签 加上**就可以了比如 div*3 就可以快速生成3个div

3.如果有父子级关系的标签,可以用>,比如 ul>li就可以了

4.如果有兄弟关系的标签,用 + 就可以了 比如 div+p

5.如果生成带有类名或者id名字的,直接写.demo 或者 #two tab 键就可以了

6.如果生成的div类名是有顺序的,可以用自增符号$

快速生成CSS样式语法

CSS 基本采取简写形式即可

1.比如w200 按tab 可以生成 width: 200px;

2.比如 lh26 按tab 可以生成 line-height: 26px;

相关推荐
Earth explosion5 小时前
ide使用技巧与插件推荐
ide
dringlestry5 小时前
pycharm将当前项目上传到github
ide·pycharm·github
安冬的码畜日常10 小时前
【Mastering Vim 2_05】第四章:深入理解 Vim 的结构化文本
编辑器·vim·undotree·文本编辑·ctags·youcompleteme·结构化文本
莲动渔舟12 小时前
国产编辑器EverEdit - 语法着色及嵌入式多语言着色
编辑器·emeditor·notepad·everedit
莲动渔舟12 小时前
国产编辑器EverEdit - 如何在EverEdit中管理工程?
编辑器·emeditor·notepad·everedit
Et2nity12 小时前
tiptap md 编辑器实用场景开发
前端·javascript·编辑器·markdown
明月清风徐徐13 小时前
Miniconda + VSCode 的Python环境搭建
ide·vscode·python
老友@14 小时前
OnlyOffice:前端编辑器与后端API实现高效办公
前端·后端·websocket·编辑器·onlyoffice
郑祎亦17 小时前
IDE(集成开发环境)
ide
三掌柜66617 小时前
使用Trae AI IDE,轻松实现交友聊天功能
ide·人工智能