css解决字符串中同时存在 中文、英文、数字字符，自动换行不对齐问题

html-css029

css解决字符串中同时存在 中文、英文、数字字符，自动换行不对齐问题,第1张

1、普通设置： style{ width:400px overflow:hidden text-overflow:ellipsis display:-webkit-box / * autoprefixer:off * / -webkit-box-orient:vertical / * autoprefixer:on * / -webkit-line-clamp:4 } 效果如下：以上会导致英文和数字自动换行不对齐。 2、解决后 style{ width:400px word-break:break-all word-wrap:break-word overflow:hidden text-align:left//这是我在表格中使用时表头设置了居中，通用可不设置 text-overflow:ellipsis display:-webkit-box / * autoprefixer:off * / -webkit-box-orient:vertical / * autoprefixer:on * / -webkit-line-clamp:4 }

<p class="main">

<span class="title">内容：</span>

<span class="content">中国人民万岁中国人民万岁中国人民万岁中国人民万岁</span>

</p>

css:

.main{clear:bothoverflow:hiddenwidth: 200px}

.title,.content{float:leftline-height:20pxdisplay: inline-block}

.title{width: 50px}

.content{width: 150px}

浮动加设定固定宽就够了