语义标签是属于HTML5还是html4 语义标签图

转载

mob64ca14154457 2024-01-29 01:50:44

文章标签 语义标签是属于HTML5还是html4 html html5 CSS 类名 文章分类 HTML5 移动开发

语义标签

<div>标签

div是英语division“分割”的缩写，它可以实现文档区块分隔，<div></div>标签对用来将相关的内容组合到一起，以和其他内容分割，使文档结构更清晰。<div></div>是最常见的HTML标签，因为它可以结合CSS使用，实现网页的布局，这种布局形式叫做“DIV+CSS” 。<div></div>像是一个容器，什么都可以容纳。

<div>标签的class属性

<div>标签可以添加class属性表示类名，类名服务于CSS，因此类名不能随便取，下面是一些常见的类名和其所代表的区域。

区域	类名
页头	header
logo	logo
导航条	nav
横幅	banner
内容区域	content
页脚	footer

HTML5区块标签

因为不用网站的class属性（类名）没有一个统一的规范，会造成搜索引擎对于内容抓取的难度，因此HTML5推出了许多新的区块标签，下图是一些常见的区块标签和说明：

区块标签	说明
<section>	文档的区域，语义比div大
<article>	文档的核心文章内容，会被搜索引擎主要抓取
<aside>	文档的非必要相关内容，比如广告等
<nav>	导航条
<header>	页头
<main>	网页核心部分
<footer>	页脚

语义标签

<span>标签

<span>标签是文本中的“区块”标签，本身没有任何特殊的显示效果，可以结合CSS来丰富样式。示例代码如下：

<body>
    <p>
        <span>天津</span>今天的天气是<span>晴天</span>
    </p>
    <p>
        <span>北京</span>今天的天气也是<span>晴天</span>
    </p>
</body>

代码效果如下:

语义标签是属于HTML5还是html4 语义标签图_CSS

<b>、<u>、<i>标签

<b>、<u>、<i>标签已经被CSS替代，但是在网页中也可以表示需要强调的文本。

标签	说明
<b>	被加粗的文字，CSS已经替代了它的功能
<u>	加下划线的文字，CSS已经替代了它的功能
<i>	倾斜的文字，CSS已经替代了它的功能