Web标准是由W3C组织和其它标准化组织制定的一系列标准的集合。W3C(万维网联盟)是国际最著名的标准化组织。
1.为什么需要Web标准
浏览器不同,它们显示页面或者排版就有些许差异。
2.Web标准的构成
主要包括结构(Structure)、表现(Presentation)和行为(Behavior)三个方面。
标准 | 说明 |
---|---|
结构 | 结构用于对网页元素进行整理和分类,现阶段主要学的是HTML |
表现 | 表现用于设置网页元素的版式、颜色、大小等外观样式,主要指的是CSS |
行为 | 行为是指网页模型的定义及交互的编写,现阶段主要学的是Javascript |
3.1Chinese(Simplified)
vscode下载完毕是英文版的,先安装这个插件,改为中文版,所以是我们第一个安装的插
件。
3.2 Auto Rename Tag
修改开始标签,结束标签跟着自动变化,比较好用。
3.3 One Dark Pro 颜色主题
本人比较喜欢的一个颜色主题
3.4 格式化代码(vscode系统自带)
现在格式化代码的插件非常多,比如Prettier等等。
如果刚开始学,不太建议安装插件,先自己手写规范的语法格式比较好
但是html标签嵌套比较多,可能需要自动格式化比较好,所以我们可以利用vscode自动的功
能格式化代码,暂且不用格式化插件,自动保存照样能格式化代码。
(1)点击管理按钮---选择里面的设置命令
然后就可以了。
4.open in browser浏览器预览页面
编写完代码,需要浏览器预览,可以安装这个插件
6. Live Server实时预览(推荐)
刚才的插件是可以预览我们的页面,但是改完代码,浏览噪必须要重新刷新,比较麻烦,因此
推荐各位小伙伴安装live server这个插件,修改完代码保存后,自动更新浏览器
7. vscode-icons设置文件图标主题
可以很清楚看到文件对用的图标。
只是为了看文件更加直观哈
8. Easy LESS 编译less文件
我们写的less不能直接引入到html文件中,通过这个插件可以自动帮我们生成css文件
8.会了吧
是的,你没看错,这个插件的名字就是<会了吧>
你是不是还在为英文单词不认识而发愁,是不是认识不会读而烦心,这个插件你值得拥有。
快捷键
添加多个光标:ctrl+alt+上箭头(下箭头)
ctrl+h 替换,注意选择全部替换即可
快速定位到某一行:ctrl+g
选择某个区块进行操作:shift+alt 然后拖动鼠标