语义化标签（一）

最新推荐文章于 2022-04-23 17:14:55 发布

Samatha_子衿

最新推荐文章于 2022-04-23 17:14:55 发布

阅读量125

点赞数

分类专栏：前端文章标签： html

本文链接：https://blog.csdn.net/weixin_44489591/article/details/104695125

版权

前端专栏收录该内容

10 篇文章 0 订阅

订阅专栏

该板块分为两部分，第二部分在语义化标签（二）中

1.n级标题标签

h1~h6,一级标题～六级标题，标题重要性依次递减，依次缩小字体
一级标题在一个网页中只能存在一个，仅次于title

<hgroup>
	 <h1>回乡偶书</h1>
	 <h2>其一</h2>
</hgroup>

2.段落标签

表示一段话，是块元素（独占一行）

3.em和Strong

em：表示语音语调的强调
Strong:强调重要内容

<p>只要你坚持，一定<em>能</em>成功！</p>
<p>这段话<strong>内容</strong>非常重要</p>

4.引用标签

长引用：blockquote（参考此处引用栏效果，独占一行）
短引用：q（加引号）

鲁迅说：
      <blockquote>这世上本没有路，走的人多了，便成了路</blockquote>

子曰： <q>学而时习之，不亦说乎</q>

5.small标签和换行标签

small：常用于合同细则，比之前的字体小一号
br：换行

我说<small>字体变小，常用于合同细则</small><br />

完整代码：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>SemanticTag</title>
  </head>
  <body>
    <hgroup>
      <h1>一级标题</h1>
      <h2>二级标题</h2>

      <br />

      <p>这是一段话</p>

      <!-- em:强调语音语调 -->
      <p>今天天气<em>真</em>好!</p>
      <!-- strong:强调内容 -->
      <p>这段话<strong>内容</strong>非常重要</p>

      我说<small>字体变小，常用于合同细则</small><br />

      鲁迅说：
      <blockquote>这世上本没有路，走的人多了，便成了路</blockquote>
      子曰： <q>学而时习之，不亦说乎</q>
    </hgroup>
  </body>
</html>

Samatha_子衿

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
语义化标签（一）

在html中更需注重的是其语义而非样式，常见的语义化标签有：1.n级标题标签h1~h6,一级标题～六级标题，标题重要性依次递减，依次缩小字体一级标题在一个网页中只能存在一个，仅次于title <hgroup> <h1>回乡偶书</h1> <h2>其一</h2> </hgroup>2.段落标签...
复制链接

扫一扫