这是我的尝试(见这里):
body {
overflow: hidden;
}
span {
border: solid 2px blue;
white-space: nowrap;
text-overflow: ellipsis;
}
本质上,当窗口变小时,我希望空间用省略号缩小。我做错了什么?
这是我的尝试(见这里):
body {
overflow: hidden;
}
span {
border: solid 2px blue;
white-space: nowrap;
text-overflow: ellipsis;
}
本质上,当窗口变小时,我希望空间用省略号缩小。我做错了什么?
当前回答
将下面的代码添加到您喜欢的地方
例子
p{
display: block; /* Fallback for non-webkit */
display: -webkit-box;
max-width: 400px;
margin: 0 auto;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
其他回答
你可以尝试在CSS中添加以下省略号:
.truncate {
width: 250px;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
}
但这段代码似乎只适用于单行修剪。更多修剪文本和显示省略号的方法可以在这个网站上找到:http://blog.sanuker.com/?p=631
确保你有一个块元素,一个最大大小,并将overflow设置为hidden。(在IE9和FF 7测试)
http://jsfiddle.net/uh9zD/
div {
border: solid 2px blue;
white-space: nowrap;
overflow: hidden;
text-overflow: ellipsis;
width: 50px;
}
将下面的代码添加到您喜欢的地方
例子
p{
display: block; /* Fallback for non-webkit */
display: -webkit-box;
max-width: 400px;
margin: 0 auto;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
}
我有一个问题与省略下铬。打开空白:nowrap似乎解决了这个问题。
max-width: 95px;
max-height: 20px;
overflow: hidden;
display: inline-block;
text-overflow: ellipsis;
border: solid 1px black;
font-size: 12pt;
text-align: right;
white-space: nowrap;
在CSS中添加下列行以使省略号工作
p {
display: block; // change it as per your requirement
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
}