Emmet语法可以让我们在写网页的时候速度更快，我当前写网页的工具是pycharm，在pycharm中使用Emmet，我们需要点击File,然后点击Setting
搜索emmet，保证这里是勾选状态
安装后如果不进行其他设置，emmet自动被勾选
目录
1 Emmet在html中的使用
1.1 创建骨架
1.2 快速创建标签
1.3 快速创建多个标签
1.4 快速生成层级标签
1.5 一起创建多个同级标签
1.6 快速生成某类的标签
1.7 快速生成指定id的标签
1.8 快速按顺序创建类与标签
1.9 快速生成有内容的标签
1.10 混合使用
2 Emmet在css中的使用
3 快速格式化代码
1 Emmet在html中的使用
1.1 创建骨架
在创建html的时候，pycharm已经自动生成了html的骨架，如果我们不想用这个骨架，我们输入!然后按下tab，那么它就会生成一个骨架
1.2 快速创建标签
我们在body中输入div
然后按下tab，它就会变成这样
使用其他标签也是一样
1.3 快速创建多个标签
我们现在想创建10个p标签，那么我们可以这样写
然后按下tab
它就会生成10个p标签，使用其他标签也是一样
1.4 快速生成层级标签
比如我们想要创建一个ul，然后里面放一个li，那么我们这样写
之后按下tab
他就会生成一个ul套一个li，用ol(li),div(span)等其他父子关系标签也是一样
1.5 一起创建多个同级标签
我们使用加号把想创建的标签加起来
然后按下tab
1.6 快速生成某类的标签
我们输入点和类名
然后按下tab
它就会变成指定类名的div标签，默认是div标签，我们也可以生成别的标签，比如我们现在写p.class_name
之后按下tab
它就变成了类名为class_name的p标签
1.7 快速生成指定id的标签
我们输入井号和id名称
然后按下tab
它就会变成指定id名称的div标签，默认是div标签，如果我们想创建id名为id_name的h1标签，那么我们输入h1#id_name
然后按下tab
1.8 快速按顺序创建类与标签
我们输入.hello$*5
然后按tab
别的标签也是一样
按下tab
1.9 快速生成有内容的标签
我们输入 p{hello world}
然后按tab
别的标签也是一样
1.10 混合使用
上面提到的所有emmet语法都可以混合使用，比如
按下tab后就是这样的
2 Emmet在css中的使用
pycharm中用不了，vscode中可以使用，使用的时候输入css样式的第一个字符，比如 text-align:center，我们输入tac然后按tab就可以看到text-align:center了
用vscode的时候可以看一下这个 P95黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移动端前端视频教程_哔哩哔哩_bilibili
3 快速格式化代码
我们写代码的时候总会出现这样的问题
这两个div是平级的，但是它没有对齐，这个时候我们按下ctrl+Alt+L，可以快速格式化代码，按下之后就变成这个样子了
但在pycharm中对css不使用，写完style后，再对html部分进行格式化则不会生效
如果使用vscode的话，右键然后点击格式化代码，无论是对html部分或是css部分，都可以生效
用vscode的话可以看一下这个 P96黑马程序员pink老师前端入门教程，零基础必看的h5(html5)+css3+移动端前端视频教程_哔哩哔哩_bilibili
