语义化标签

最新推荐文章于 2024-06-17 17:48:38 发布

MondayCui

最新推荐文章于 2024-06-17 17:48:38 发布

阅读量137

点赞数

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

本文链接：https://blog.csdn.net/mondaycui/article/details/108502172

版权

前端学习专栏收录该内容

42 篇文章 1 订阅

订阅专栏

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
</head>
<body>
    <!-- 
        （Ctrl+回车 光标下移换行）
        在网页中HTML专门来负责网页的结构，所以在使用HTML标签时应关注标签的语义而不是样式

        标题标签：
            h1~h6 一共六级标题
            从h1~h6重要性递减
            h1在网页中的重要性仅次于title标签，一般情况下一个页面只有一个h1
            一般情况下标题标签只会使用到h1~h3，h4~h6很少用到

            标题标签是块元素

        在页面中独占一行的元素称为块元素（block element）
     -->
     <h1>一级标题</h1>
     <h2>二级标题</h2>
     <h3>三级标题</h3>
     <h4>四级标题</h4>

     <!-- 
         hgroup标签用来为标题分组，可以将一组相关的标题同时放入到hgroup中
      -->
      <hgroup>
            <h1>111</h1>
            <h2>22</h2> 
      </hgroup>
      

     <!-- 
         p标签标示页面中的一个段落
         p也是一个块元素
      -->
    <p>表示一个段落</p>

    <!-- 
        em标签 用于表示语音语调的加重
        strong 表示强调，重要内容！

        在页面中不会独占一行的元素称为行内元素（inline element）
     -->
     <p>今天天气<em>真</em>不错</p>
     <p>今天必须<strong>打一架</strong></p>

     鲁迅说：
      <!-- blockquote 表示长引用，块元素 -->
     <blockquote>这句话我没说过</blockquote>
    
     <!-- q 表示短引用，行内元素 -->
     子曰<q>学而时习之</q>

     <!-- br 标签表示页面中的换行  （写代码时换行，网页中不会显示换行，顶多一个空格） -->
     <br>
     <br>
     <p>1235</p>
     
</body>
</html>