html基础标签
2018-10-14 本文已影响0人
stay丶gold
<!DOCTYPE html> <!--使用W3C标准-->
<html>
<head>
<meta http-equiv="content-type" charset="UTF8"></meta><!-- 指定编码-->
<meta name="keyword" content="测试"></meta><!-- 关键字检索-->
<meta name="description" content="hahah"></meta><!-- 浏览器显示的描述-->
<!--<meta http-equiv="Refresh" content="20;URL=https://www.sina.com.cn"></meta>--><!-- 20s后刷新，跳转到sina-->
<title>标题</title>
<link rel="apple-touch-icon" href="https//i3.sinaimg.cn/home/2013/0331/U586P30DT20130331093840.png"><!-- 标题显示的图标-->
</head>
<body>
<div id="top">顶部</div>
<h1>h1标签，加粗加大， 独占一行，块标签</h1>
<h2>h2标签，加粗加大， 独占一行，块标签</h2>
<h3>h3标签，加粗加大， 独占一行，块标签</h3>
<h4>h4标签，加粗加大， 独占一行，块标签</h4>
<hr><!-- 横线-->
<p>p标签，段落标签，独占一行，块标签，可嵌套</p>
<p>p标签，床前明月光</p>
<p>p标签，床前明月光</p>
<p>p标签，床前明月光</p>
换行br标签,横线hr标签<br>
<hr>
<b>b标签,加粗</b>
<strong>strong标签,加粗</strong><br>
<hr><!-- 横线-->
<strike>strike标签,横线</strike>
<hr><!-- 横线-->
<em>em标签,斜体</em>
<hr><!-- 横线-->
3<sub>3</sub><!-- 下角标-->
2<sup>2</sup><!-- 上角标-->
<hr>
<div style="background-color: yellow">div标签鸡毛功能都没有，独占一行，块标签，可嵌套，就像一张白纸，所以刚好搭配css来渲染使用</div>
<hr>
<span style="background-color: yellow">内联标签span，只占该占用的部分</span>
<hr>
<!--特殊字符-->
特殊字符    <a href="https://www.jb51.net/onlineread/htmlchar.htm">特殊字符表</a> <!--  空格-->
1<2 <!--< 小于<-->
2>1 <!--> 大于>-->
© <!--©-->
® <!--®-->
<hr>
<b>块级标签可以嵌套块级标签和内联标签；内联标签只能嵌套文本和内联标签</b><br>
<img src="http://www.chinadaily.com.cn/language_tips/images/attachement/jpg/site1/20070814/001125254635082b41be0a.jpg"
alt="图片未加载" title="图片" width="300px" height="200px"></img>
<br><a href="https://www.sina.com.cn/" target="_blank" name="哈哈哈">sina</a><!--target="_blank" 另外开一个窗口-->
<hr>
<ul><!--无序列表-->
<li><a href="#C1">第一章</a></li>
<li><a href="#C2">第二章</a></li>
<li><a href="#C3">第三章</a></li>
</ul>
<h2><a name="C1">第一章</a></h2><!--name标签可做目录-->
<p>本章讲解的内容是 ... ...</p>
<h2><a name="C2">第二章</a></h2>
<p>本章讲解的内容是 ... ...</p>
<h2><a name="C3">第三章</a></h2>
<p>本章讲解的内容是 ... ...</p>
<hr>
<ol><!--oder有序列表-->
<li><a href="#C1">第一章</a></li>
<li><a href="#C2">第二章</a></li>
<li><a href="#C3">第三章</a></li>
</ol>
<hr>
<dl>
<dt>第一章</dt>
<dd>第一节</dd>
<dd>第二节</dd>
</dl>
<a href="#top">回到顶部</a> <!--#和id唯一对应-->
</body>
</html>
