zoukankan      html  css  js  c++  java
  • 【图标文字垂直对齐】♣verticalalign:length

    ①<span>应用<s style="绝对定位"></s></span>
    ②<span style="背景图片">应用</span>
    ③<span>应用<s style="vertical-align:length"></s></span>

    无视文字本身垂直对齐问题!!!

    <!DOCTYPE html>
    <html lang="zh-CN">
    <head>
        <meta charset="utf-8" />
        <title></title>
        <style type="text/css">
            /*kissy reset*/
            body,h1,h2,h3,h4,h5,h6,hr,p,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea,th,td{margin:0;padding:0}
            body,button,input,select,textarea{font:12px/1.5 'Droid Serif',tahoma,arial,\5b8b\4f53,sans-serif}
            h1,h2,h3,h4,h5,h6{font-size:100%}
            address,cite,dfn,em,var{font-style:normal}
            code,kbd,pre,samp{font-family:courier new,courier,monospace}
            small{font-size:12px}
            ul,ol{list-style:none}
            a{text-decoration:none}
            a:hover{text-decoration:underline}
            sup{vertical-align:text-top}
            sub{vertical-align:text-bottom}
            legend{color:#000}
            fieldset,img{border:0}
            button,input,select,textarea{font-size:100%}
            table{border-collapse:collapse;border-spacing:0}
            article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{display:block;margin:0;padding:0}
            mark{background:#ff0}
            /*page*/
            .box1{height:18px;background-color:#F00}
            .box1 b{display:inline-block;width:0;height:0;overflow:hidden;border-top:4px solid #FFF;border-right:4px dotted transparent;border-left:4px dotted transparent;vertical-align:2px}
        </style>
    </head>
    <body>
        <div class="box1">应用<b></b></div>
        <hr />
        <div class="box1">应用app<b></b></div>
        <hr />
        <div class="box1">app<b></b></div>
        <hr />
        <div class="box1">应用</div>
        <hr />
        <div class="box1">应用app</div>
        <hr />
        <div class="box1">app</div>
        <hr />
    </body>
    </html>
  • 相关阅读:
    0916 编程实验一 词法分析程序 总结
    0916 编程实验一 词法分析程序
    0909编译
    C语言文法
    词法分析编译感想
    词法分析
    0909 编译原理
    0429团队3.0
    0428 团队项目合作2.0作业
    0422 数学口袋精灵app
  • 原文地址:https://www.cnblogs.com/jzm17173/p/2752062.html
Copyright © 2011-2022 走看看