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>