html
HTML5
Hyper Text Markup Language，超文本标记语言
W3C标准（标准化）
W3C标准包括：
（1）结构化标准语言（HTML、XML——配置文件）
（2）表现标准语言（CSS）
（3）行为标准（DOM——文档对象模型、ECMAScript——JavaScript）
IDE
WebStorm（JetBrains)、VScode、HBuilder、Sublime Text
结构
<!--DOCTYPE：告诉浏览器使用什么规范-->
<!DOCTYPE html>
<html lang="en">
<!--head标签代表网页头部-->
<head>
<!--meta标签描述网站的一些信息-->
<!--一般用于做SEO-->
<meta charset="UTF-8">
<meta name="keywords"content="关键字">
<meta name="description"content="网页描述">
<!--title标签代表网页标题-->
<title>Title</title>
</head>
<!--body标签代表网页主题-->
<body>
Hello,world!
</body>
</html>
基本标签
写在body标签中
1、标题标签
<!--标题标签-->
<!--一般使用到三级标签-->
<h1>一级标签</h1>
<h2>二级标签</h2>
<h3>三级标签</h3>
<h4>四级标签</h4>
<h5>五级标签</h5>
<h6>六级标签</h6>
2、段落标签
<!--段落标签p-->
<p>笑</p>
<p>作者：林徽因</p>
<p>笑的是她的眼睛，口唇，</p>
<p>和唇边浑圆的旋涡。</p>
<p>艳丽如同露珠，</p>
<p>朵朵的笑向</p>
<p>贝齿的闪光里躲。</p>
<p>那是笑——神的笑，美的笑；</p>
<p>水的映影，风的轻歌。</p>
<p>笑的是她惺松的鬈发，</p>
<p>散乱的挨着她的耳朵。</p>
<p>轻软如同花影，</p>
<p>痒痒的甜蜜</p>
<p>涌进了你的心窝。</p>
<p>那是笑——诗的笑，画的笑：</p>
<p>云的留痕，浪的柔波。</p>
3、换行标签
<!--换行标签br,自闭合标签,紧凑-->
笑<br/>
作者：林徽因<br/>
笑的是她的眼睛，口唇，<br/>
和唇边浑圆的旋涡。<br/>
艳丽如同露珠，<br/>
朵朵的笑向<br/>
贝齿的闪光里躲。<br/>
那是笑——神的笑，美的笑；<br/>
水的映影，风的轻歌。<br/>
笑的是她惺松的鬈发，<br/>
散乱的挨着她的耳朵。<br/>
轻软如同花影，<br/>
痒痒的甜蜜<br/>
涌进了你的心窝。<br/>
那是笑——诗的笑，画的笑：<br/>
云的留痕，浪的柔波。<br/>
4、水平线标签
<!--水平线标签hr,建议加上闭合-->
<hr/>
5、字体样式标签
<!--粗体，斜体-->
<h1>字体样式标签</h1>
粗体： <strong>hello</strong>
斜体： <em>hello</em>
6、注释和特殊符号
<!--特殊符号,& ;-->
<!--查百度-->
空格：
大于号：>
小于号：<
版权符号：©
7、图像标签
7.1、常见的图像格式
JPG
GIF
PNG
BMP（位图）
……
7.2、img标签
<img src="图像地址（相对路径/绝对路径）"alt="图像的替代文字"title="鼠标悬停提示文字"width="图像宽度"height="图像宽度"……/>
8、链接标签
<!--
href:链接路径
target:链接在哪个窗口打开，常用值：_self、_blank
-->
<a href="path"target="目标窗口位置">链接文本或图像</a>
8.1、文本超链接、图像超链接
<!--文本超链接-->
<a href="xxx">跳转到xxx</a>
<!--图片超链接-->
<a href="xxx"><img src="/img.png"></a>
8.2、页面间链接、锚链接、功能性链接
<!--
此处id值必须在当前页面中唯一存在
联想记忆：CSS选择器
-->
<span id="top">顶部</span>
<a href="#top">跳转到当前页面的顶部</a>
9、块级元素、行级元素 —> css中如何将一个块元素切换成行内元素
9.1、块级元素
无论内容多少，该元素独占一行，默认垂直方向排列（p、h1-h6、div）
9.2、行级元素
内容撑开宽度，左右都是行内元素的可以再排在一行（a、strong、em、span…）
10、列表
信息资源的一种展示形式，使信息结构化和条理化，并以列表的样式显示出来，以便更快捷地获得相应的信息。
分类：
无序列表ul、li
有序列表ol、li
自定义列表dl、dt、dd
11、表格
简单通用、结构稳定
基本结构
- 由单元格构成
- 行：th/tr、列：td
- 跨行（Excel合并单元格）：tr中的rowspan、跨列（Excel合并单元格）：td中的colspan
12、视频、音频
视频元素video、音频元素audio
13、页面结构分析，语义化标签
header：网页头部
section：Web页面中的一块独立区域，主体
article：独立的文章内容
aside：侧边栏
nav：导航页
footer：网页脚部
14、iframe内联框架
`<iframe src="path（引用页面地址）"name="mainFrame（框架标识名）">
浙公网安备 33010602011771号