zoukankan      html  css  js  c++  java
  • 实现一行文字两端对齐

    需求中有时会遇到字数不同却需要两端对齐,如下图结构:

    在字中间加空格并不能完全对齐。css中有属性text-align: justify,在文字内容超过一行时可实现对齐。如图所示,文字只有一行,实现对齐时需借助行内空标签实现。

    <span class="name">用户名:<i></i></span>
    .name {
        display: inline-block;
        width: 65px;
        height: 18px;
        text-align: justify;
    
        i {
            display: inline-block;
            width: 100%;
        }
    }

    即可达到效果

  • 相关阅读:
    [恢]hdu 2005
    [恢]hdu 2004
    [恢]hdu 1093
    [恢]hdu 1092
    [恢]hdu 2008
    [恢]hdu 1091
    [恢]hdu 2006
    [恢]hdu 1089
    [恢]hdu 1094
    OGRE小记
  • 原文地址:https://www.cnblogs.com/lianglanlan/p/11600015.html
Copyright © 2011-2022 走看看