900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > css 文字超出部分自动加省略号

css 文字超出部分自动加省略号

时间:2023-09-06 19:46:45

相关推荐

css 文字超出部分自动加省略号

在移动端,经常会在适配的时候遇到文字超出的问题,最合理的做法就是超出部分自动加省略号。

用到的属性有

text-overflow: ellipsis; /显示省略符号来代表被修剪的文本/word-break: break-all; /允许在单词内换行/white-space: nowrap; /不换行 控制单行文本/

<!--多行文本超出部分加省略号-->.a{width: 300px;word-break: break-all;text-overflow: ellipsis;overflow: hidden; white-space: normal;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 3;/*控制文字行数*/height: 50px;/*控制div的高度*/}<!--单行文本超出部分加省略号-->.b{width: 300px;word-break: break-all; /*允许在单词内换行*/text-overflow: ellipsis;/*显示省略符号来代表被修剪的文本*/overflow: hidden;white-space: nowrap;/*不换行 控制单行文本*/}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。