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;

相关推荐
黑科技研究僧5 分钟前
蘑兔AI的12轨分轨功能:编曲师深度测评
人工智能·经验分享·vscode·学习·新媒体运营·音视频
xiaoshuaishuai829 分钟前
C# 定制化Markdown编辑器
开发语言·c#·编辑器
lg_cool_42 分钟前
使用conda管理python运行环境并关联vscode
vscode·python·conda
syc78901231 小时前
Vibe Coding实战对比:终端迭代与可视化AI IDE的真实开发差异
大数据·ide·人工智能
蜗牛旅行1 小时前
trae快捷键记录
ide
m0_693200652 小时前
VSCode使用ssh remote插件远程连接linux主机
linux·vscode·ssh
qq_3384323719 小时前
VS Code 远程 WSL 中 Claude Code 导致 Java 文件修改被自动撤回的一次排查
vscode·vibe coding·claude code
Ycocol21 小时前
AS同一个目录下的类导入导入其他类爆红无法跳转但是可以编译
android·ide·android studio
睡一觉就好了。1 天前
vim基础操作
linux·编辑器·vim
elirlove11 天前
打造属于自己的网页工匠台:HTML在线编辑器技术深度解析
前端·编辑器·html