我们在使用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的含义
- pdfjs预览 vue中常见的坑及修改预览的标题名 2023-10-08
- Ajax基础详解教程(一) 2023-01-20
- 学习JavaScript一定要知道的3个小技巧 2023-08-12
- ajax数据传输方式实例详解 2022-10-18
- 深入探究JavaScript中WeakMap的原理与用法 2023-07-09
- 在vue-cli使用scss 2023-10-08
- AJax与Jsonp跨域访问问题小结 2022-10-18
- Flutter Tab 切换时保留tab的状态 2022-09-08
- openhtmltopdf 学习所遇到的问题 2023-10-26
- TWebBrowser 与 MSHTML(2): 获取 window 对象的时机 2023-10-26