演示代码:

<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8">
        <title></title>
        <style type="text/css">
            .a{
                font-size: 40px;
                background: red;
                vertical-align: middle;
            }
            .b{
                font-size: 20px;
                background: green;
                vertical-align: middle;/* 垂直对齐方式 */
            }
        </style>
    </head>
    <body>
        <!-- <p>19.9<sub>元</sub></p>
        <p>19.9<sup>元</sup></p> -->
        <div>
            <!-- 
            垂直对齐方式:对行级元素,行内块级元素,表格元素有效
                baseline 默认值,对其父元素基线.写字母4条线,从下往上数第二条线
                sub,对其下标
                super,对其上标
                top,顶部对齐
                bootom,底部对齐
                middle,垂直居中
                text-top
                text-bottom
             -->
            <span class="a">19.9</span>
            <span class="b">元</span>
        </div>
    </body>
</html>
打开支付宝首页搜“559920739”领红包,领到大红包的小伙伴赶紧使用哦! (如果你觉得本文不错,请扫描下面二维码随意打赏哦)
最后修改:2020 年 10 月 30 日
如果觉得我的文章对你有用,请随意赞赏