10分钟记住并理解html5的标签及作用(超实用)
<!DOCTYPE html> <!-- 文档类型定义 -->
<html> <!-- 开始标记 --> <!-- html 标记 标签 -->
<head> <!-- 括号内的属性和属性值 -->
<meta charset="utf-8"> <!-- 字符编码集UTF-8识别多种国家语言 -->
<!-- 只有开头没有结尾的为单标记-->
<title></title>
<!-- 标题,网页的标签页 -->
</head>
<body> <!-- 网页的正文 -->
<h1>一级标题</h1>
<h2>二级标题</h2>
<h3>三级标题</h3>
<p>表现文章段落</p>
<!-- 无序列表 -->
<ul>
<li>无序列表</li>
<li>无序列表</li>
<li>无序列表</li>
<li>无序列表</li>
......
<!-- 可有多个列表项 -->
</ul>
<!-- 有序列表 -->
<ol>
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
<li>有序列表</li>
......
</ol>
<!-- 定义列表 -->
<dl>
<dt>定义列表</dt>
<dt>定义列表</dt>
<dt>定义列表</dt>
......
</dl>
<!-- 预格式文本 -->
<pre>
代码怎么敲的格式,页面就会 怎么样 展现。
</pre>
<!-- 引用 -->
<blockquote>大段的引用</blockquote>
<q>小段的引用</q>
<p>哭疼<span style="color:red"> 老鼠</span>,换牙</p>
<a href="#" style="text-decoration: none;color: blue" target="_blank">超文本链接</a> <!-- target属性可新开一个页面跳转 -->
<img src="images/345876_03.png" >
<!-- src=后面跟路径,"../"代表退出当前文件夹,alt表示图片没加载出来时,有提示作用,提示开发人员图片内容 -->
<div>划分区块用</div>
<strong>加粗并且强调</strong>
<b>加粗</b>
<em>可以让文字倾斜,em的语义更加强烈</em>
<i>也可以文字倾斜 但是语义</br>不强调</ i> <!-- 代表空格,</br>代表换行 <hr/>为下划线-->
<sup>©</sup>
上标
<sup>®</sup>
<sub>></sub>
下标
<sub><</sub>
</body>
</html> <!-- 结束标记||闭合标记 -->
<abbr title="what dose the fuck">WTF</abbr> <!-- 缩写 -->
<figure>
<!-- 填写主要内容 -->
<figcaption></figcaption> <!-- 填写与内容相关的内容 -->
</figure>
空空如也!