我们在使用VScode想要生成HTML代码模板很简单，只需要输入!之后按TABVScode就会帮我们生成这样一段代码!DOCTYPE htmlhtml lang=enheadmeta charset=UTF-8meta http-equiv=X-UA-Compatible conten...
我们在使用VScode想要生成HTML代码模板很简单，只需要输入!之后按TAB
VScode就会帮我们生成这样一段代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
相较于最基本的HTML代码多了什么呢？
- doctype
- lang属性
- 三个meta标签
那他们有什么作用呢？下面就是分类型的解释
1. lang属性
lang属性规定元素内容的语言，用在此处则规定了HTML的全局语言属性
通俗的来说就是规定了主要语言，这里的en为英语，其他语言可以通过参考表查到
HTML 语言代码参考手册 (w3school.com.cn)
2. 文件兼容性
文件兼容性定义了让浏览器如何编译你的网页
效果是让你的网页在不同版本的浏览器都有一致的外观
2.1DOCTYPE
自IE6开始允许网页开发人员选择IE编译和显示他们网页的方式，想要使用这个增强功能，网页必须包含恰当的
<!DOCTYPE>指令
在这里DOCTYPE是用来声明文档类型和DTD规范的：具体来说就是告诉浏览器我这是什么类型的文档+文档的行文规范
常见的DOCTYPE
HTML5的简化
<DOCTYPE html>
HTML4的两种方式：Strict严格模式（不包含弃用元素），Transitional传统模式（包含弃用元素）
2.2 X-UA-Compatible
指定网站的文件兼容性模式，判断一个网页该使用的文件模式
这里的内容是使用IE=edge来指示IE8使用它支持的最高模式
3. 字符编码
charset属性规定了外部脚本文件中使用的字符编码
如果外部文件中的字符编码与主文件的编码不一致，就需要用charset来通用编码
另：默认的字符编码是ISO-8859-1
4. 视区Viewport
这里一个针对移动网页优化的标签
width控制viewport大小，而device-width为设备宽度，让这两者相等可以让页面不会出现显示太小的问题
而initial-scale则控制初始缩放比例，此次为1是定义加载的图片不允许缩放
本文标题为：VScode自动生成HTML的含义
基础教程推荐
- 纯vue3实现的svg可视化web组态编辑器。主要用于物联网mqtt实时系统图 2023-10-08
- 拖拽插件SortableJS的简单使用(带缓存) 2022-07-24
- Vue自学之路3-vue模版初探 2023-10-08
- 微信小程序实现文章关注功能详细流程 2022-08-30
- springmvc 结合ajax批量新增的实现方法 2023-02-23
- Vue中Element-UI日历无法缩小的问题 2023-10-08
- jQuery Ajax 实例详解 ($.ajax、$.post、$.get) 2022-10-17
- Ajax请求跨域问题解决方案分析 2023-02-23
- Javascript的独特的概念之闭包 2022-11-20
- 使用 IntraWeb (38) - TIWAppForm、TIWForm、TIWBaseHTMLForm、TIWBaseForm 2023-10-27
