HTML全称为超文本标记语言,是一个网页的骨架,如果没有HTML,则网页不会显示任何内容
后缀名为" .html "
开发工具:Visual Studio Code
Visual Studio Code - Code Editing. Redefined
基本框架
英文状态下输入 !键,出现提示,点击回车键即可生成相应内容(若不出现提示,可在 文件 -> 首选项 -> 设置 找到Editor: Insert Spaces选项勾选,点击Tab键即可生成相应内容)
<!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>
基本框架结构标签解析
<!DOCTYPE html> HTML5声明头
<html lang="en"> 默认情况下生成的lang属性值为en,表示这个网页是英文网页,会触发浏览器的自动翻译功能,为了避免这个问题,也可以将该lang属性为 zh-cn
<head></head> 此标签中的内容不会出现在页面上
<meta charset="UTF-8"> 网页编码设置
<title>Document</title> 网页标题,会显示在网页选项卡上
<body></body> 此标签内写的内容会出现在页面上。如果我们把内容写在了head标签中,浏览器解析时会给我们放在body中。如果写标签时,标签结构出现问题,浏览器会自动修复
标签
标签结构
HTML中是由一个个标签组成
<标签名></标签名> 双标签
<标签名> 单标签
标签内容
只有双标签中间才能写内容,单标签中不能包裹内容
在使用标签时,先输入标签名,然后按Tab会自动生成对应的标签结构
标签属性
标签的属性和标签名之间要有空格隔开。标签的属性只能放在开始标签内部,并且放在标签名的后面,可以写多个
<标签名 属性="属性值"></标签名>
<标签名 属性="属性值" 属性2="属性值2"></标签名>
<标签名 属性></标签名>
<标签名 属性名="属性值">
<标签名 属性名="属性值" 属性2="属性值2">
注释
快速生成注释:ctrl + /
HTML中注释类型为 <!-- -->
CSS中注释类型为/* */
注释的内容不会出现在网页上,只能在源码中看到注释;有解释代码的作用;