HTML常用快捷键都在这了 看完之后效率暴涨

是这么回事;
我今天上网页课的时候，发现好多同学在敲标签的时候敲得很慢，我再仔细一看，好家伙，他们的标签竟然都是一个一个的敲出来的！
那效率能高吗？

这是当时让敲的代码，很简单，对不对？

这是运行结果：

其实就是标签的嵌套嘛！

可是我看到好多同学都是一个ol标签，一个li标签，一个ol标签，一个li标签的敲的，这效率能高嘛？

所以说楼主不是标题党，如果你学会了这些快捷键，将会帮你省下很多的时间

好了，废话不多说，我们来介绍一下HTML中那些常用的快捷键：

1.** 注释的快捷键**
HTML中的注释格式是

这样的，中间是注释的内容（CSDN的编辑器也是这样的，所以打不出来。当然你可以使用转义字符打出来，这里不再演示）

而添加注释的快捷键是Ctrl+/或者叫Ctrl+？，（反正都是一个键）这个键就在你右手边的那个Shift键旁边

在使用这组快捷键的时候，你会发现，即使你没有选中整行代码，编译器也会帮你把整行注释掉，实际上，这个Ctrl+/键的功能是注释掉整行的内容，只要你的光标在这一行，不用选中任何内容，按了这组快捷键之后就会把整行的内容注释掉

那么，如何在一行代码的后边添加一行注释呢（行内注释）？
这时候就要用到Ctrl+Shift+/

2. 快速录入标签（补齐代码）的快捷键：Tab
   （它在键盘左上方ESC键的下面的下面、字母Q的左边）

我们写标签的时候，写到一半不想写了，怎么办？

摁Tab键啊！（当编译器弹出快捷菜单是，按回车键有同样的效果）

当需要插入好几个相同的标签时，怎么办？

比如上图中连续的五个li标签

这时，我们只需敲出一个标签名，然后再*n即可

按一下Tab键，即可成功插入

3. 关系选择器相关快捷键

父元素与子元素

如果你了解关系选择器，那么用Tab键将会大大提高你的效率
如果你不了解，也没有关系

下面我简单的讲一下，一听你就会明白

网页中不同元素之间是存在关系的，比如上图中ul标签和li标签的关系：

ul标签时li的父标签
li标签时ul的子标签

就是这么简单

直接包含子标签的标签叫父标签
直接被父标签包含的标签叫子标签

注意：互为子标签和父标签的标签一定是直接包含或被直接包含的标签
间接包含或被间接包含的标签我们叫做后代元素或祖先元素，这个我们以后会提到

那么怎么用快捷键敲出两组互为父子元素的标签呢？

（父元素>子元素）
按Tab键

当然，你也可以用前面讲的*n的方法套娃使用

兄弟元素

拥有相同父类的元素是兄弟元素（即同级的元素），比如上图中的五个li标签，它们都属于兄弟元素
兄弟元素选择器的语法为：兄+弟


你可能会说了，这不是脱裤子放屁吗？
能用*2解决的事为什么要这么麻烦？

确实，如果兄弟元素选择器的功能只有这一点的话，它的确没有什么出现的必要，但它具有一个*n无法替代的功能：插入不同类型的兄弟元素

4. 类选择器相关快捷键

   类选择器的作用：根据元素的class属性值来选中一组元素
   类选择器的语法：.class属性值
   class是标签的一个属性，和id属性类似，不同的是class可以重复使用

我们可以在程序中直接键入.class属性值，在按Tab键，编译器会自动帮我们插入一个class为你输入的属性值的div元素


当然，类选择器也可以配合关系选择器使用

5. 其他快捷键

1、在设置某元素的宽度和高度时，不必把width：200px；全部键入
只需要敲出首字母，再按Tab键即可

2、对于某些较长的属性，我们也不需要全部敲出来，下面以background-color（背景颜色为例）



按Tab键和Enter（回车）键有些许区别，大家自己总结
还有很多较长的属性可以用这种首字母的方法快速插入，这里不再一一列举，大家要善于发现和总结

6. 生成HTML初始格式
   ！+Tab键
   
   
   首先键入一个！（shift+1），再按Tab键即可快速生成HTML的初始格式

好，就先总结这么多，以后在遇到的话会给大家更新，大家也可以在评论区中补充我没有提到的快捷键，大家一起学习，一起进步！