01-html骨架
<!DOCTYPE html>
<!--声明文档 html -->
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
.....
</body>
</html>
02-快速生成+注释
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--快速注释:shift+“/”或者shift+alt+a -->
</body>
</html>
03-标题标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>标题标签</title>
</head>
<body>
<!-- 标题标签 h1-h6逐渐变小 -->
<h1>我是标题</h1>
<h2>我是标题</h2>
<h3>我是标题</h3>
<h4>我是标题</h4>
<h5>我是标题</h5>
<h6>我是标题</h6>
</body>
</html>
04-段落标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 段落标签 p -->
<p>ujtdcmjtd</P>
<p>iydcgjndc</p>
</body>
</html>
05-换行标签、水平线
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 水平线 hr/ -->
<!-- 换行标签 br/ -->
<hr/>
<p>ekjwhfui<br/>fkudjuhuithiu</p>
</body>
</html>
06-文本格式化标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<!--
加粗 strong或b
斜体 em或i
划去 del或s
下划线 nds
-->
<p>欢迎来到<strong>MDN学习区</strong>。本系列文章旨在为<b>零基础Web开发初学者提供指导和开始编写网站代码所需的所有内容</b>。</p>
<p>该教程并不是<em>“从入门到精通”</em>类型的教程,只能让你做到<i style="color: pink;">“从入门到适应”</i>。在此之后,你应该能够以你自己的方式学习MDN的其他内容,并接触到其他中、高级资源。</p>
<p>从零开始学习Web开发极具挑战性,该教程将为你提供详细的资料,手把手帮助你轻松愉快地学习。
无论你是正在学习Web开发的学生(自学或参与课程)、寻找材料的老师、编程爱好者,亦或是仅仅想了解一点点 Web 技术,我们都希望你能感到宾至如归。</p>
<del>2999</del>9.9<br/>
<s>11.0</s>10.0
</body>
</html>
07-无语义标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- div 独占一行 多用于布局 -->
<div>
efuichlds
</div>
<div>
dsajuhdajkbx
</div>
<!-- span 一行可存在多个 -->
<span>a</span>
<span>a</span>
</body>
</html>
08-图片标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- src 指向图片位置 -->
<!-- ail 图片地址发生错误时,用来提示的字 -->
<!-- title 鼠标经过时,显示的文字 -->
<!-- width 宽度 -->
<!-- height 高度 -->
<!-- border 框架 -->
<img src="" alt="" title="" width="" height="" border=""></img>
</body>
</html>
09-视频
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--
controls 控件
autoplay 自动播放
muted 静音播放
poster 等待加载时的显示图片
loop 播放完是否继续
-->
<video src="" controls autoplay muted poster=""></video>
</body>
</html>
10-音频标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--
controls 控件
autoplay 自动播放
muted 静音播放
poster 等待加载时的显示图片
loop 播放完是否继续
-->
<audio src="" controls autoplay muted poster=""></audio>
</body>
</html>
11-链接标签
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 默认当前窗口打开
href 跳转网站
target 换页跳转网站
-->
<a href="" target="_blank" ></a>
</body>
</html>
12-锚链接
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- id属性------身份证号 -->
<a href="#one">wehfjbkejw</a>
<p>cihfrgrv</p>
<p>sjnoziueda</p>
<p>ouxsgbiuc</p>
<p>ciuxygywxz</p>
<p>xseahgvuazzesx</p>
<p>iuxwgzeyufvghjxq</p>
<p>zuiuyfqgtyudwxcy</p>
<p>uaghhzFyrsdryaxc</p>
<div id="one">ouixcshaoud</div>
<p>guojagsbkjax</p>
<p>iqhsauqjgvksbkhqa</p>
</body>
</html>
13-有序列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 有序列表 ol -->
1234
<ol type="A">
<li>1</li>
<li>2</li>
<li>3</li>
<li>4</li>
</ol>
</body>
</html>
14-无序列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 无序列表 ul -->
1234
<ul type="circle">
<li>111</li>
<li>112</li>
<li>113</li>
<li>114</li>
</ul>
</body>
</html>
15-自定义列表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<dl>
<dt>
10
<dd>
1
</dd>
<dd>
2
</dd>
</dt>
</dl>
</body>
</html>
16-iframe框架
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!-- 框架 iframe 嵌套网站 -->
主页
<iframe src="" width="" height="" ></iframe>
</body>
</html>
17-特殊字符
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<!--
空格符 摄氏度 °
大于号 < 正负号 ±
小于号 > 乘号 ×
和号 & 除号 ÷
人民币 ¥ 平方 ²
版权 © 立方 ³
注册商标 ®
-->
<div>
10086 < 10087
</div>
</body>
</html>