section 和 是用于在html页面中显示内容的标签。与section和div有两个区别div
- 语义内容
- 字体大小
section和div的唯一区别是应用于其内部内容的语义。
什么是section?
Section 是一个元素,对其内部的内容具有语义。这些元素可以用来对html中的内容或元素进行分组。
它是一个HTML5元素。
节可以包含不同的块来区分内容。
这可以用在
- 段落
- 标题
- 页眉
- 页脚
- 文章
而且,每个应用于标题的相同标签的字体大小也是不同的
因此,改善了内容的可读性,提高了SEO排名 下面是一个有多个相同标题的章节标签的例子
<html>
<body>
<section>
<h1>heading 1</h1>
<p>Heading 1 paragraph.</p>
</section>
<section>
<h1>Heading 2</h1>
<p>Heading 2 paragraph.</p>
</section>
<div>
<h1>Heading 3</h1>
<p>Heading 3 paragraph.</p>
</div>
</section>
</body>
</html>
输出:

如果一个部分包含多个相同的标签,在这个例子中可以用字体大小来区分这些标签,同时颜色风格也可以相同。
什么是div标签?
Div 是一个没有语义的html标签。它用于创建其他元素的逻辑和布局,也包含其他内容元素。
下面是一个div的例子
<html>
<body>
<div>
<h1> Countries</h1>
<ul>
<li>India</li>
<li>USA</li>
<li>Germany</li>
</ul>
<h1>Employee List</h1>
<table>
<tr>
<th>Id</th>
<th>Name</th>
<th>Sal</th>
</tr>
<tr>
<td>1</td>
<td>Franc</td>
<td>5000</td>
</tr>
<tr>
<td>11</td>
<td>Eric</td>
<td>4000</td>
</tr>
<tr>
<td>5</td>
<td>Andrew</td>
<td>1000</td>
</tr>
</table>
</div>
</body>
</html>
输出

浏览器支持
Div 标签支持旧的和所有最新的浏览器,包括chrome, Internet Explorer, Firefox, Safari
Section 标签在支持html5的最新浏览器中也有支持。
总结
Div用于创建布局和内容元素的分组,没有语义意义。
Section标签在内容中具有语义,可以提高可读性和SEO。