84669 Lernen von Personen
152542 Lernen von Personen
20005 Lernen von Personen
5487 Lernen von Personen
7821 Lernen von Personen
359900 Lernen von Personen
3350 Lernen von Personen
180660 Lernen von Personen
48569 Lernen von Personen
18603 Lernen von Personen
40936 Lernen von Personen
1549 Lernen von Personen
1183 Lernen von Personen
32909 Lernen von Personen
Wie im Titel ist die Breite festgelegt. Wenn sie die Anzahl der Wörter überschreitet, verwenden Sie ...
光阴似箭催人老,日月如移越少年。
overflow:hidden;white-space:nowrap;text-overflow:ellipsis; overflow:hidden:超出隐藏 white-space:nowrap:强制不换行 text-overflow:ellipsis:超出省略号代替;
传送门,去看看
固定做法,需要以下四个条件:1.宽度固定2.overflow:hidden3.white-space:nowrap4.text-overflow:ellipsis
display: -webkit-box; box-orient: vertical; line-clamp: 3; // 可控制几行后有 ... -webkit-box-orient: vertical; -webkit-line-clamp: 3; // 兼容写法 overflow: hidden; white-space:normal;
首先第一点,需要给那一行一个固定的宽度,即使不给固定宽度,也需要通过margin来限制这行,说白了,就是让这行有个固定的宽度。。。其他的代码如下
如果是一个p标签 p{ width:100px;//固定宽度 overflow:hidden;//超出隐藏 white-space:nowrap;//不换行 text-overflow:ellipsis;//省略号 }
/a/11...两种实现方式,固定宽度,超出部分显示...,鼠标悬浮现实省略内容
// line-clamp、line-height和height直接控制多行 .two-line { color: #333; line-height: 18px; height: 36px; overflow : hidden; text-overflow: ellipsis; display: -webkit-box; display: -moz-box; -webkit-line-clamp: 2; -moz-line-clamp: 2; line-clamp: 2; -webkit-box-orient: vertical; -moz-box-orient: vertical; box-orient: vertical; }
有固定宽度,使用overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
传送门,去看看
固定做法,需要以下四个条件:
1.宽度固定
2.overflow:hidden
3.white-space:nowrap
4.text-overflow:ellipsis
首先第一点,需要给那一行一个固定的宽度,即使不给固定宽度,也需要通过margin来限制这行,说白了,就是让这行有个固定的宽度。。。
其他的代码如下
/a/11...
两种实现方式,固定宽度,超出部分显示...,鼠标悬浮现实省略内容
有固定宽度,使用overflow:hidden;text-overflow:ellipsis;white-space:nowrap;