10 html常用标签以及标题标签

最新推荐文章于 2022-07-26 17:07:39 发布

hello_sunny123

最新推荐文章于 2022-07-26 17:07:39 发布

阅读量1.8k

点赞数

分类专栏：前端

本文链接：https://blog.csdn.net/hello_sunny123/article/details/118032820

版权

前端专栏收录该内容

60 篇文章 3 订阅

订阅专栏

学习标签是有技巧的,重点是记住每个标签的语义。简单理解就是指标签的含义,即这个标签是用来干嘛的。

根据标签的语义,在合适的地方给一个最为合理的标签,可以让页面结构更清晰。

在这里插入图片描述

标题标签`<h1>------<h6> (重要)`

为了使网页更具有语义化,我们经常会在页面中用到标题标签。HTML提供了6个等级的网页标题,即：`<h1>------<h6>`

h 单词head的缩写,意为头部、标题。标签语义:作为标题使用,并且依据重要性递减。

特点：

1.加了标题的文字会变的加粗,字号也会依次变大。

2.一个标题独占一行。

标题标签代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>标题标签</h1>
    <h1>标题一共六级选，</h1>
    <h2>文字加粗一行显。</h2>
    <h3>由大到小依次减,</h3>
    <h4>从重到轻随之变。</h4>
    <h5>语法规范书写后,</h5>
    <h6>具体效果刷新见。</h6>
    ------pink老师    
</body>          
</html>

标题标签代码运行结果

在这里插入图片描述

练习：体育新闻

水花61分伊戈达拉制胜抢断西决勇士再胜开拓者总分2-0

数据统计:水花兄弟合砍61分

库里22投11中,三分14投4中,罚球11罚全中得到37分8篮板8助攻,职业生涯季后赛得分30+次数来到35次,超过哈登排名现役第3位,仅次于詹姆斯和杜兰特。

汤普森22投8中,三分8投4中得到24分3篮板2助攻,德拉蒙德-格林得到16分10篮板7助攻5盖帽,凯文鲁尼得到14分7篮板2助攻,今天勇士有7名替补出场。

兄弟对决升级:小库里给哥哥造成压力

库里兄弟是NBA历史上第一对在分区决塞相遇的兄弟。在西决第1场中,小库里没有给哥哥造成压力,他出场19分钟,7投1中只得到3分3篮板2助攻,在场期间输掉10分。

旦在西决第2场中,小库里攻防两端都打出杰出的表现,全场送出4次抢断,包括直接抢断自己的哥哥库里,在防守端给库里造成了极大的困扰。

作者: pink老师
2019-8-8

练习代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h1>水花61分伊戈达拉制胜抢断西决勇士再胜开拓者总分2-0</h1>

<h4>数据统计:水花兄弟合砍61分</h4>

<p>库里22投11中,三分14投4中,罚球11罚全中得到37分8篮板8助攻,职业生涯季后赛得分30+次数来到35次,超过哈登排名现役第3位,仅次于詹姆斯和杜兰特。</p>

<p>汤普森22投8中,三分8投4中得到24分3篮板2助攻,德拉蒙德-格林得到16分10篮板7助攻5盖帽,凯文鲁尼得到14分7篮板2助攻,今天勇士有7名替补出场。</p>

<h4>兄弟对决升级:小库里给哥哥造成压力</h4>

<p>库里兄弟是NBA历史上第一对在分区决塞相遇的兄弟。在西决第1场中,小库里没有给哥哥造成压力,他出场19分钟,7投1中只得到3分3篮板2助攻,在场期间输掉10分。</p>

<p>旦在西决第2场中,小库里攻防两端都打出杰出的表现,全场送出4次抢断,包括直接抢断自己的哥哥库里,在防守端给库里造成了极大的困扰。</p>

<p>作者: pink老师<br/>
    2019-8-8</p>

</body>
</html>