美文网首页Web前端之路程序员
HTML5基础——文字常用标签(下)

HTML5基础——文字常用标签(下)

作者: 微学派 | 来源:发表于2016-12-27 21:06 被阅读122次

    一、微文概览

    1. 粗体、斜体、下划线、删除线
    2. 上标与下标

    二、详细介绍

    • 1. 粗体、斜体、下划线、删除线

    我们在浏览网页的时候,经常会看到一些特殊效果的文字,比如粗体、斜体、下划线、删除线等,下面我将给大家介绍这些效果。

    1.1 粗体

    语法:

    <strong>粗体字</strong>
    

    案例代码:

    <html>
        <head>
            <title>文字的粗体</title>
        </head>
        <body>
            <strong>粗体字</strong>
        </body>
    </html>
    

    运行效果:


    粗体字.png

    1.2 斜体

    语法:

    <em>斜体字</em>
    

    案例代码:

    <html>
        <head>
            <title>文字的斜体</title>
        </head>
        <body>
            <em>斜体字</em>
        </body>
    </html>
    

    运行效果:


    斜体.png

    1.3 下划线

    语法:

    <u>下划线</u>
    

    案例代码:

    <html>
        <head>
            <title>文字的下划线</title>
        </head>
        <body>
            <u>下划线</u>
        </body>
    </html>
    

    运行效果:


    下划线.png

    1.4 删除线

    语法:

    <strike>删除线</strike>或<s>删除线</s>
    

    案例代码:

    <html>
        <head>
            <title>文字的删除线</title>
        </head>
        <body>
            <strike>文字的删除线</strike><br/>
            <s>文字的删除线</s>
        </body>
    </html>
    

    运行效果:


    删除线.png
    • 2. 上标与下标

    我们在浏览网页时,有时会看到数字的平方m²,m³,还有在上化学课时,经常会用到下标,比如CO2,其中2在O的下方,那么这种效果的文字该如何表示呢?
    语法:

    <sup>上标</sup>
    <sub>下标</sub>
    

    案例代码:

    <html>
        <head>
            <title>文字的上下标</title>
        </head>
        <body>
            m<sup>2</sup><br/>
            CO<sub>2</sub>
        </body>
    </html>
    

    运行效果:


    文字的上标与下标.png

    相关文章

      网友评论

        本文标题:HTML5基础——文字常用标签(下)

        本文链接:https://www.haomeiwen.com/subject/ezyevttx.html