为了账号安全,请及时绑定邮箱和手机立即绑定

HTML文本标签

标签:
Html/CSS

目录

这一节主要记录以下几个知识点:

标题标签

HTML中标题是有级别区分的,这就要求不同的标题要有不同的标签等级做区分,h1、h2、h3、h4、h5、h6分别代表了网页中的六种不同级别的标题,其中h1级别最高,显示出来的字体也最大,h6级别最低,字体也最小。看一下代码:

<body>

    <h1>一级标题</h1>

    <h2>二级标题</h2>

    <h3>三级标题</h3>

    <h4>四级标题</h4>

    <h5>五级标题</h5>

    <h6>六级标题</h6>

</body>

再看一下浏览器中的运行结果

图片.png

注意不要将这些标题标签和之前讲过的title标签混为一谈,标题标签用在body标签中主要作用是对网页内容添加标题,而title只是用于在浏览器标题栏中显示当前页面的标题。

段落和换行标签

段落标签

HTML中使用<p>和</p>表示一段文字,比如这一首《塞上听吹笛》:

<body>
    <h3>塞上吹听笛</h3>
    <p>
        雪净胡天牧马还,月明羌笛戍楼间。
        借问梅花何处落,风吹一夜满关山。
    </p>
</body>

在浏览器中的显示效果:

图片.png

标题和诗句内容是在不同的段落中的,也就是说<p>和</p>之间的内容是独占一个段落的。但是我们会发现整首诗的内容是显示在一行里的,这个排版就显的不好看了。如果想让诗的每个整句单独一行显示就需要使用换行标签</br>。

换行标签

HTML中使用单标签</br>表示换行,稍微修改一下上面的内容就可以达到换行的效果。

<body>
    <h3>塞上听笛</h3>
    <p>
        雪净胡天牧马还,月明羌笛戍楼间。<br>
        借问梅花何处落,风吹一夜满关山。
    </p>
</body>

看一下效果

图片.png

没有做过多的改动,这是在第一行诗的末尾加了个</br>标签

文本标签

在HTML中,我们可以使用“文本标签”来对文字进行修饰,如粗体、斜体、上标、下标等。常用的文本标签有以下8种

粗体标签:strong、b
斜体标签:i、em、cite
上标标签:sup
下标标签:sub
中划线标签:s
下划线标签:u
大字号标签:big
小字号标签:small
<body>

    <b>粗体标签</b><br>

    <!-- <strong>粗体标签</strong> -->

    <i>斜体标签</i><br>

    <!-- <em>斜体标签</em>

    <cite>斜体标签</cite> -->

    上标<sup>标签</sup><br>

    下标<sub>标签</sub><br>

    <s>中线标签</s><br>

    <!-- <del>中线标签</del> -->

    <u>下划线</u><br>

    <!-- big标签建议使用css替代 -->

    <big>大字号标签</big><br>

    <small>小字号标签</small>

</body>

看一下运行效果

图片.png

水平线标签

HTML中使用<hr>实现水平线的效果。

<body>
    水平线
    <hr>
</body>

运行效果如下

图片.png

点击查看更多内容
2人点赞

若觉得本文不错,就分享一下吧!

评论

作者其他优质文章

正在加载中
感谢您的支持,我会继续努力的~
扫码打赏,你说多少就多少
赞赏金额会直接到老师账户
支付方式
打开微信扫一扫,即可进行扫码打赏哦
今天注册有机会得

100积分直接送

付费专栏免费学

大额优惠券免费领

立即参与 放弃机会
意见反馈 帮助中心 APP下载
官方微信

举报

0/150
提交
取消