Emmet语法

用于提高html/css编写速度（适用于VS Code）

快速生成HTML结构

1．生成标签直接输入标签名按tab键即可比如div然后tab键，就可以生成<div></div>
2．如果想要生成多个相同标签加上就可以了比如div3就可以快速生成3个div
3．如果有父子级关系的标签，可以用>比如ul> li就可以了
4．如果有兄弟关系的标签，用＋就可以了比如div+p
5．如果生成带有类名或者id名字的，直接写.demo或者#two tab键就可以了
6．如果生成的div类名是有顺序的，可以用自增符号$*

快速生成CSS结构

CSS基本采取简写形式即可
1.比如 w200 按回车可以生成width:200px;
2.比如lh26 按回车可以生成 line-height:26px;

快速格式化语法

Vscode 快速格式化代码: shift+alt+f

也可以设置当我们保存页面的时候自动格式化代码:

1）文件------.>【首选项】------>【设置】;
2）搜索emmet.include;
3) 在settings.json下的【用户】中添加以下语句:
“editor.formatOnType”:true,
“editor.formatOnSave”: true
只需要设置一次即可，以后都可以自动保存格式化代码

//如果没有出现settings.json，则下载一个插件：eslint 即可

或者：

1、点击左侧齿轮状图标
2、选择【Settings】
3、在Settings窗口中点击【Text Editor】
4.在Form On Save前打勾即可

这样，ctrl+s后，页面会自动格式化代码

Emmet语法及设置相关推荐

CSS中的emmet语法（使用缩写的方式提高书写html编写速度）
使用CSS的emmet语法:使用缩写的方式提高书写html编写速度. (1)快速生成html结构语法: 如果想要生成多个相同的标签,加上"*"就可以了,如div*3,生成三个div ...
Emmet语法——HTML和CSS快速生成代码/VS code如何快速格式化代码
前言:本篇文章简单讲述了HTML和CSS中的Emmet语法,更多详细语法内容可以参见此文章 https://code.z01.com/Emmet/ Emmet 语法 Emmet语法的前身是Zen co ...
CSS基础（emmet 语法,CSS 复合选择器, 布局认知,背景样式）
CSS基础 1. emmet 语法 -- 开发效率 1.1 emmet 语法生成 html 标签 emmet 的特点和作用是什么? 通过简写提高编码效率. emmet 生成 HTML 结构语法序号 ...
CSS（Emmet语法、复合选择器、元素显示模式、背景）
文章目录 1.Emmet语法 1.1快速生成HTML结构语法 1.2快速生成CSS样式语法 1.3快速格式化代码 2.CSS的复合选择器 2.1什么是复合选择器 2.2后代选择器 2.3子选择器(重要 ...
CSS 2 emmet语法复合选择器元素显示模式
目录 Emmet语法 1.1快速生成HTML结构标签 1.2快速生成CSS样式语法 CSS的复合选择器 1.1什么是复合选择器 1.2后代选择器(重要) 1.3子选择器(重要) 1.4并集选择器(重要 ...
VScode必备插件、Emmet语法、面试题更新——用到老
欢迎加入前端技术营!如果你也是前端学习者或者对前端有学习的想法,那就跟着我一起从零开始进击前端. 致力于尽可能详细且简洁的介绍前端知识.自己的捷径,也是学习路上的记录.欢迎探讨目录一.V ...
6.Emmet 语法与快速格式化代码
Emmet语法可以让我们在写网页的时候速度更快,我当前写网页的工具是pycharm,在pycharm中使用Emmet,我们需要点击File,然后点击Setting 搜索emmet,保证这里是勾选状态 ...
CSS-5 列表元素(ol+ul++li+dl+dt+dd)、表格元素、单元格合并、表单元素(input+label+radio+...)、Emmet语法、结构伪类(:nth-child）
目录 1_列表元素 1.1_列表的实现方式 1.2_有序列表 – ol – li 1.3_无序列表 – ul - li 1.4_定义列表 – dl – dt - dd 1.5_ 写前端代码逻辑顺序 2 ...
前端与移动开发-----CSS（emmet 语法+CSS 复合选择器+元素的显示模式）
css emmet 语法 -- 开发效率 emmet 的特点和作用:通过简写提高编码效率. emmet 生成 HTML 结构语法: emmet 语法快速生成 css 样式: 1,常用属性大多用英文单词 ...

Emmet语法及设置

Emmet语法

快速生成HTML结构

快速生成CSS结构

快速格式化语法

Emmet语法及设置相关推荐

最新文章

热门文章