section 元素
section 元素用于對網(wǎng)站或應(yīng)用程序中頁面上的內(nèi)容進(jìn)行分塊鞭莽。一個 section 元素通常由內(nèi)容及其標(biāo)題組成。但 section 元素并非一個普通的容器元素；當(dāng)一個容器需要被直接定義樣式或通過腳本定義行為時暮刃，推薦使用 div 而非 section 元素融师。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Section 元素</title>
<body>
<section>
<h2>蘋果</h2>
<p>這是一個水果,可以吃.</p>
</section>
</body>
</html>
注意內(nèi)容：
- 通常不推薦沒有標(biāo)題內(nèi)容使用
section元素,不要與article元素混淆。section的作用是對頁面上的內(nèi)容進(jìn)行分塊或?qū)ξ恼逻M(jìn)行分段轻要。- 不要將
section元素作為設(shè)置樣式的頁面容器- 如果
articleasidenav元素更符合使用條件复旬，那就不使用section元素。
<!DOCTYPE html>
<html lang="zh-CN">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Section 元素</title>
</head>
<body>
<!-- 強調(diào)蘋果的獨立性 -->
<article>
<h1>蘋果</h1>
<p>這是一個水果冲泥，可以吃驹碍，而且還很好吃壁涎。</p>
<section>
<h2>紅富士</h2>
<p>這是一種外表很紅的水果，吃起來也不錯</p>
</section>
<section>
<h2>青蘋果</h2>
<p>這是一種外表很紅的水果志秃，吃起來也不錯</p>
</section>
</article>
<!-- 強調(diào)水果的獨立性 -->
<section>
<h1>水果</h1>
<p>水果都很好吃</p>
<article>
<h2>梨子</h2>
<p>梨子是一種水份較多的水果</p>
</article>
<article>
<h2>荔枝</h2>
<p>荔枝是一種糖分較高的水果</p>
</article>
</section>
</body>
</html>
