[04]HTML基础之块级标签
1. <p>
标签
表示段落,多个空白符会合并成一个;<pre>
标签表示预文本段落,所有空白符都不合并。
//临江仙诗句
<p>滚滚长江东逝水,浪花淘尽英雄,是非成败转头空。
青山依旧在,几度夕阳红。</p>
<pre>白发渔樵江渚上,惯看秋月春风,一壶浊酒喜相逢。
古今多少事,都付笑谈中。</pre>
2. <ul>
标签
表示无序列表,表现为每个子项前都有圆点;<ol>
标签表示有序列表,表现为每个子项前都有序号;<li>
标签表示列表的子项目。
//无序列表
<ul> 导航:
<li>首页</li>
<li>分类</li>
</ul>
//有序列表
<ol> 目录:
<li>第一章:灵感</li>
<li>第二章:创作</li>
</ol>
3. <dl>
标签
表示定义列表;<dt>
标签表示定义列表的标题;<dd>
标签表示定义列表的数据。
<dl>
<dt>IEC</dt>
<dd>国际电工委员会(International Electrotechnical Commission)成立于1906
年,它是世界上成立最早的国际性电工标准化机构,负责有关电气工程和电子工程领域中
的国际标准化工作。 </dd>
</dl>
4. <header>
标签
语义标签,表示文档的头部;<main>
标签表示文档的主体;<footer>
标签表示文档的页脚。前面三个标签与<div>
标签效果一致,但重在语义的强调上面。
//可以放置网站logo及导航链接
<header> 网站logo 导航链接 </header>
//可以放置文章内容或评论
<main> 文章标题 文章内容 </main>
//可以放置联系信息或版权信息
<footer> 版权信息 备案信息 </footer>
5. <article>
标签
语义标签,表示重要的独立内容,例如某段文章的内容;<aside>
标签表示不那么重要的偏旁内容,例如文章的分类标签,作者信息等。
<h1>断章节选</h1>
<article>你站在桥上看风景,看风景的人在桥上看你;明月装饰了你的梦,你装饰了别人的
梦。</article>
<aside>作者:卞之琳,祖籍南京市溧水区,现当代诗人、文学评论家、翻译家。</aside>
6. <hgroup>
标签
语义标签,表示标题的分组;<h1>
标签表示一级标题;<h2>
标签表示二级标题;<h3>
标签表示三级标题;<h4>
标签表示四级标题;<h5>
标签表示五级标题;<h6>
标签表示六级标题。
<hgroup>
<h1>宇宙历史</h1>
<h2>世界历史</h2>
<h3>亚洲历史</h3>
<h4>中国历史</h4>
<h5>唐朝历史</h5>
<h6>安史之乱</h6>
</hgroup>
7. <address>
标签
语义标签,表示文档作者的联系信息,表现为略微倾斜的字体,一般放在<footer>
标签里面。
<address>联系站长:<a href="mailto:contact@juetan.cn">绝弹</a> </adress>
8. <nav>
标签
语义标签,表示导航内容,与<ol>
、<ul>
标签相比,强调语义的作用。
<nav>
<a href="/">首页</a>
<a href="/about">关于</a>
</nav>
英语单词
p:段落(paragraph的缩写)
pre: 预定义(predefined的缩写)
header: 头部
main:主要
footer:脚部
article:文章
aside:旁白
h:大字标题(headline的缩写)
group:分组
adress:地址
nav:导航(navigation的缩写)
ul:无序列表(unorder list的缩写)
ol: 有序列表(order list的缩写)
li:列表项目(list item的缩写)
dl:定义列表(defined list的缩写)
dt:定义列表标题(defined title的缩写)
dd:定义列表数据(defined data的缩写)
nav: 导航(navigator的缩写)