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;

相关推荐
HockerF3 小时前
windows 设置 vscode 免密远程
ide·windows·vscode
广煜永不挂科10 小时前
Android Studio关于Connection refused: connect报错
android·ide·android studio
林林要一直努力10 小时前
Android Studio安装,SDK、Gradle、模拟器、AS路径改为非C盘(Windows为例)
android·ide·android studio
0wioiw013 小时前
Apple基础(Xcode①-项目结构解析)
ide·macos·xcode
懒大王爱吃狼20 小时前
PyCharm功能及安装使用教程
ide·python·pycharm·python基础·python教程·pycharm安装·pycharm使用
DechinPhy1 天前
VSCode手动版本更新
ide·vscode·编辑器
Sadsvit1 天前
Linux Vim 编辑器使用指南
linux·编辑器·vim
_别来无恙_1 天前
vscode 字体的跟换
ide·vscode·编辑器
写写闲篇儿2 天前
Visual Studio的妙用
ide·visual studio
wr3541010662 天前
Mac电脑使用IDEA启动服务后,报service异常
java·ide·spring boot·macos·tomcat·maven·java-consul