首先谢谢邀请，这里Python大星谈谈web前端初学快捷键的困惑。不足之处，请指出，共同学习进步
一、web前端开发工具
常见的五种web前端开发工具：
● sublime
● Hbuilder
● VS Code
● Atom
● Brackets
作为web前端开发工具，当我们灵活利用编辑器的快捷方式时，会极大地提高我们书写代码的效率。二、第一个web前端快捷方式在我们刚踏入web前端学习领域时，看到别人能快速生成一个html标准文档是十分羡慕的。如何去操作，其实并不难。
操作步骤：在文档中输入英文感叹号”!” > > 再按住tab键即可
如果你不能达到下图中的效果，请尝试安装 Emmet 插件
三、快捷键的扩展下面讲解前端常用的一些快捷方式，最后以tab键结束。其中第9条真的是太太太有用了，初学你不看会后悔一辈子。
1、快速生成多个元素，比如5个div
2、给元素增加class或者id属性
举个栗子，给div增加属性
● 增加class属性使用.
div.first
+ tab键
● 增加id属性使用#
div#first + tab键
3、给元素增加内容，使用{ }
4、两个元素是兄弟元素，使用+
5、后代元素，使用>
7、上级元素使用^
当使用 的指令之后，再继续写下去，那么后续内容都是在 li 下级的。如果我想编写一个跟 ul 平级的 span 标签，那么我需要先用 “^” 提升一下层次。
8、$的使用
● $出现一次，正序从 1 开始
● $出现一次，倒序
● $出现多次，正序从0开始
● 使用 @N 指定开始的序号
8、分组：()
用括号进行分组，表示一个代码块，分组内部的嵌套和层级关系和分组外部无关
9、lorem生成随机文本
三、小结工欲善其事，必先利其器。掌握好开发工具中的快捷键，我将事半功倍。最近我在头条号上写《Python Web全栈之旅》web前端部分，欢迎关注“Python大星”，呼吸不停，学习不止。
正常情况下按Tab键时，是按内容中的控件添加时的顺序，谁先添加就谁先。为了能够自定义顺序，就产生了个一tabindex属性。简单理解就是定义Tab键的顺序的。
先解释a标签的宽高，a标签属于行内元素，默认情况下是不支持设置宽高的，仅依靠内容来“撑大自己”。这时我们需要用css的display属性并且值设置为block即可。这么设置浏览器就会将被设置的a标签识别为块元素。这时宽高的设置参数就有效了。a标签的文字垂直居中很简单，只需要设置css的line-height属性即可，将像素值设置的和高度一致就是垂直居中了。下面举例说明：css：html：
我是A标签的内容
运行结果：未使用css：宽高是依靠内容来决定。使用css后：宽高是依靠css属性来决定。