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;

相关推荐
TOSUN同星2 小时前
干货分享 | TSMaster DBC编辑器操作指南:功能详解+实战示例
数据库·oracle·编辑器·汽车·软件工程
LIN-JUN-WEI3 小时前
[ESP32]VSCODE+ESP-IDF环境搭建及blink例程尝试(win10 win11均配置成功)
c语言·开发语言·ide·vscode·单片机·学习·编辑器
MUTA️8 小时前
pycharm中本地Docker添加解释器
ide·python·pycharm
Ronin30510 小时前
【Linux系统】vim编辑器 | 编译器gcc/g++ | make/Makefile
linux·运维·服务器·ubuntu·编辑器·vim
织_网10 小时前
Visual Studio Code 中统一配置文件在团队协作中的应用
ide·vscode·编辑器
界面开发小八哥19 小时前
「Java EE开发指南」如何用MyEclipse创建一个WEB项目?(三)
java·ide·java-ee·myeclipse
花花鱼19 小时前
android studio 设置让开发更加的方便,比如可以查看变量的类型,参数的名称等等
android·ide·android studio
雷羿 LexChien21 小时前
从 Prompt 管理到人格稳定:探索 Cursor AI 编辑器如何赋能 Prompt 工程与人格风格设计(上)
人工智能·python·llm·编辑器·prompt
到底起什么网名才能不重名1 天前
使用各种CSS美化网页
前端·css·vscode·bootstrap·html
不知所云,1 天前
3. lvgl 9.3 vscode 模拟环境搭建 lv_port_pc_vscode-release-v9.3
ide·vscode·编辑器·c·sdl·lvgl vscode·lvgl模拟器