CSS的宽度与高度

css实现单行文本的溢出显示省略号

 <style>
        .demo {
            white-space: nowrap; #不折行
            overflow: hidden;　　#溢出隐藏
            text-overflow: ellipsis; #使用省略号来代替被修剪的文本
        }
    </style>

css实现多行文本的溢出显示省略号

 <style>
        .demo {          
　　　　　　　　display: -webkit-box;
            -webkit-line-clamp: 2;
            -webkit-box-orient: vertical;
            overflow: hidden;
        }
    </style>

文字两端对齐

 　　　　 div {
            border: 1px blue solid;
            font-size: 20px;
        }
    
        span {
            border: 1px red solid;
            text-align: justify;
            display: inline-block;
            width: 5em;
            line-height: 20px;
            height: 20px;
            overflow: hidden;
        }
    
        span:after {
            display: inline-block;
            content: '';
            width: 100%;
        }
    </style>
    </head>
    
    <body>
        <div>
            <span>姓名</span>
            <br>
            <span>联系方式</span>
        </div>
    
    </body>