首页 > 编程知识 正文

css如何强制换行对齐,css标签过长不自动换行

时间:2023-05-06 04:27:06 阅读:158582 作者:4230

1.自动换行:

word-wrap:break-word;

魔兽世界:正规;

2.强制换行:

word-break:break-all; 通过字符换行的截断/*与IE和chrome相对应,FF为*/

word-wrap:break-word; 按英语单词截断换行符/*以上三个浏览器都是*/

*注意:对于单词换行符,父框必须是块级元素

3.强制不换行:

white-space:nowrap;

属性规定文本溢出包含元素时发生。 文本覆盖:剪辑;

常用场景width:100px; /*要显示的文本宽度*/text-overflow :ellipsis; /*将被截断的文字显示为点。 另一个值表示clip不显示点*/white-space :nowrap; 防止/*字符换行*/overflow :隐藏; */overflow :隐藏; /*超出则隐藏*

多行文本溢出显示(…) div { width: 300px; height: 40px; /*白色-空格:nowrap; */overflow :隐藏; display: -webkit-box; - WebKit-box-orient : vertical; -webkit-line-clamp: 2; 文本覆盖: ellipsis; }适用范围:

由于使用了WebKit的CSS扩展属性,因此此方法适用于WebKit浏览器和移动端;

请注意,ie核心浏览器必须定义线高度和高度。 -webkit-line-clamp表示几行。 例如

line-height: 20px;

最大高度: 40px;

display: -webkit-box;

- WebKit-box-orient : vertical;

-webkit-line-clamp: 2;

overflow :隐藏;

在标题的最后,这个APP场景还可以,

我不怎么频繁地写。

写博客并记录

暂时正在补充多行

版权声明:该文观点仅代表作者本人。处理文章:请发送邮件至 三1五14八八95#扣扣.com 举报,一经查实,本站将立刻删除。