文字分散对齐

普通文字分散

效果:

https://sandbox.runjs.cn/show/pfadwcwp

代码 :

    <div class="test1">
        十年前你说生如夏花<i></i>
    </div>
    <div class="test2">
        十年后你说平凡才是唯一的答案
    </div>
    div{
        border: 1px solid #f0f;
        color: #fff;    
        width: 300px;
        margin-top: 10px;
    }
    
    .test1 {
        text-align:justify;
    }
    .test1 i {
        display:inline-block;
        width: 100%;
        /*padding-left: 100%;*/
    }
    
    .test2 {
        text-align:justify;
    }
    .test2:after {
        content: "";
        display:inline-block;
        padding-left:100%;
    }   

表格中 内文字分散对齐

<td> 添加如下属性即可

    text-align:center;
    text-align:justify;
    text-justify:distribute-all-lines;
    text-align-last:justify;
posted @ 2018-03-26 21:55 小鸣的微笔记 阅读(...) 评论(...) 编辑 收藏