HTML基础（三）Semantic HTML

最新推荐文章于 2026-06-16 21:04:58 发布

原创

最新推荐文章于 2026-06-16 21:04:58 发布 · 1k 阅读

标签

#html

收录于

本文介绍了Semantic HTML，包括其定义和区别于not-Semantic元素的特性。 Semantic HTML通过使用如<form>,<table>,<article>等有明确语义的标签，有助于浏览器为残障人士提供辅助服务，同时便于搜索引擎优化内容。文章还提到了如何在实际中运用Semantic HTML，强调其与CSS的配合使用。" 132633663,19694624,C# Winform入门：从Label控件开始,"['C#开发语言', 'Windows应用开发', 'UI设计']

1.什么是Semantic

Semantic有语义的元素，比如<form>,<table>,<article>等，就是确切定义了元素的标签
not-Semantic就是没有具体语义的元素，比如<div>和<span>
HTML中用于定义网页不同部分的Semantic元素：
在这里插入图片描述

2.Semantic有什么好处

主要是为了让机器能读懂这样一来有几个好处：
1.就方便浏览器根据内容为一些残障人士提供特殊的服务。
2.方便搜索引擎来对索引好的内容作各种处理和挖掘

3.如何书写Semantic

其实就是用几个标签而已

<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