1.section元素
section元素表示页面中的一个内容区块,比如:章节、页眉、页脚或页面中的其他部分。可以和h1、h2、h3等元素结合起来使用,标示文档结构。
强调分段或分块, 不要为没有标题的内容区块使用section
<section>
<h2>您好</h2>
<p>今天天气晴</p>
</section>
2.article元素
article元素表示页面中的一块与上下文不相关的独立内容,比如:博客中的一篇文章或报纸中的一篇文章。
强调独立性
<article>
<h1>article</h1>
<section>
<p>星期一</p>
</section>
<section>
<p>星期二</p>
</section>
</article>
3.aside元素
aside元素表示article元素的内容以外的、与article元素的内容相关的辅助信息。
4.hgroup元素
hgroup元素用于对整个页面或页面中一个内容区块的标题进行组合。
5.figure元素
figure元素表示一段独立的流内容,一般表示文档主体流内容中的一个独立单元。使用figcaption元素为figure元素组添加标题。
<figure>
<figcaption>来了来了</figcaption>
<p>The people`s republic of china was born in 1949...</p>
</figure>
6.progress元素
progress元素表示运行中的进程,可以使用progress元素来显示JavaScript中耗费的时间的函数的进程。
<progress></progress>
<meter></meter>
7.ruby元素
ruby元素表示ruby注释(中文注音或字符)。
<ruby>羅馬
<rp>(</rp>
<rt>ローマ</rt>
<rp>)</rp>
</ruby>
<ruby>现代汉语拼音
<rp>(</rp>
<rt>xiàn dài hàn yǔ pīn yīn</rt>
<rp>)</rp>
</ruby>
< rt >中的是要展现的中文注音或字符,< rp >中是当浏览器不支持时展现的内容。
浏览器支持时:
浏览器不支持时:
8.wbr元素
wbr元素表示软换行,与br元素的区别是:br元素表示此处必须换行,而wbr元素的意思则是浏览器窗口或父级元素的宽度足够宽时(没必要换行时),不进行换行,而当宽度不够时,主动在此处进行换行。wbr元素好像对字符型语言作用挺大,但对于中文,貌似没有多大用处。
9.details元素
details元素表示用户要求得到并可以得到的细节信息。它可以与summary元素配合使用。summary元素提供标题或图例。标题是可见的,用户点击标题时,会显示出细节信息。summary元素应该是details元素的第一个子元素。
<details>
<summary>HTML5</summary>
this Document teaches you everything you have to learn about HTML5.
</details>
10.contentEditable元素(全局属性)
全局属性指的是可以对任何元素都使用的属性。
contentEditable元素的主要功能是允许用户编辑元素中的内容,所以该元素必须是可以获得鼠标焦点的元素,而且在点击鼠标后要向用户提供一个插入符号,提示用户该元素中的内容允许编辑。contentEditable属性是一个布尔值,被指定为false或true。
除此之外,该属性还有个隐藏的inherit(继承)状态,属性为true时,元素被指定为允许编辑;属性为false时,元素被指定为不允许编辑;未指定true或false时,则由inherit状态来决定,如果元素的父元素是可编辑的,则该元素就是可编辑的。
<ul contenteditable="true">
<li>列表1</li>
<li>列表2</li>
<li>列表3</li>
</ul>