许多网站都包含如下 HTML 代码: <div id=“nav”><div class=“header”><div id=“footer”> 指示导航、页眉和页脚。
在 HTML 中,有一些语义元素可用于定义网页的不同部分:
<article>
<aside>
<details>
<figcaption>
<figure>
<footer>
<header>
<main>
<mark>
<nav>
<section>
<summary>
<time>
HTML <section> 元素
该元素定义文档中的部分。<section>
根据 W3C 的 HTML 文档:“部分是内容的主题分组,通常带有标题。
可以使用元素的示例:<section>
章
介绍
新闻项目
联系方式
一个网页通常可以分成几个部分进行介绍, 内容和联系信息。
1 2 3 4 5 6 7 8 9 10 11
文档中的两个部分:
<section> <h1>WWF</h1> <p>The World Wide Fund for Nature (WWF) is an international organization working on issues regarding the conservation, research and restoration of the environment, formerly named the World Wildlife Fund. WWF was founded in 1961.</p> </section>
<section> <h1>WWF's Panda symbol</h1> <p>The Panda has become the symbol of WWF. The well-known panda logo of WWF originated from a panda named Chi Chi that was transferred from the Beijing Zoo to the London Zoo in the same year of the establishment of WWF.</p> </section>
<article> <h2>Google Chrome</h2> <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p> </article>
<article> <h2>Mozilla Firefox</h2> <p>Mozilla Firefox is an open-source web browser developed by Mozilla. Firefox has been the second most popular web browser since January, 2018.</p> </article>
<article> <h2>Microsoft Edge</h2> <p>Microsoft Edge is a web browser developed by Microsoft, released in 2015. Microsoft Edge replaced Internet Explorer.</p> </article>
.browser > h2, p { margin: 4px; font-size: 90%;} </style>
</head> <body>
<articleclass="all-browsers"> <h1>Most Popular Browsers</h1> <articleclass="browser"> <h2>Google Chrome</h2> <p>Google Chrome is a web browser developed by Google, released in 2008. Chrome is the world's most popular web browser today!</p> </article> <articleclass="browser"> <h2>Mozilla Firefox</h2> <p>Mozilla Firefox is an open-source web browser developed by Mozilla. Firefox has been the second most popular web browser since January, 2018.</p> </article> <articleclass="browser"> <h2>Microsoft Edge</h2> <p>Microsoft Edge is a web browser developed by Microsoft, released in 2015. Microsoft Edge replaced Internet Explorer.</p> </article>
因此,您会发现带有元素的 HTML 页面 包含元素,以及包含元素的元素。<section> <article> <article> <section>
HTML <header> 元素
该元素表示介绍性内容的容器或 一组导航链接。<header>
元素通常包含:<header>
一个或多个标题元素 (<h1> - <h6>)
徽标或图标
作者信息
**注意:**您可以将多个元素合二为一 HTML 文档。但是,不能放在 或其他元素中。<header> <header> <footer> <address> <header>
1 2 3 4 5 6 7 8 9 10
<article>的标题:
<article> <header> <h1>What Does WWF Do?</h1> <p>WWF's mission:</p> </header> <p>WWF's mission is to stop the degradation of our planet's natural environment, and build a future in which humans live in harmony with nature.</p> </article>
<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>
<aside> <h4>Epcot Center</h4> <p>Epcot is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.</p> </aside>
<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>
<aside> <p>The Epcot center is a theme park at Walt Disney World Resort featuring exciting attractions, international pavilions, award-winning fireworks and seasonal special events.</p> </aside>
<p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p> <p>My family and I visited The Epcot center this summer. The weather was nice, and Epcot was amazing! I had a great summer together with my family!</p>
0评论