发布网友
共3个回答
热心网友
需要准备的材料分别有:电脑、浏览器、html编辑器。
1、首先,打开html编辑器,新建html文件,例如:index.html。
2、在index.html中的<style>标签中,输入css代码:
div{
width: 100px;
overflow:hidden;
text-overflow:ellipsis;
display:-webkit-box;
-webkit-box-orient:vertical;
-webkit-line-clamp:2;
}
3、浏览器运行index.html页面,此时文字超过2行会自动把多余部分用省略号显示 。
热心网友
如果想要在一行里实现“超出长度显示省略号”,是可以的。
overflow: hidden;white-space: nowrap;text-overflow:ellipsis;
这几句css就可以,不要加上去的容器一定要写了宽度的
注意:这里实现的是“超出长度”,而不是“超出字数”,并且在一行里实现。
如果是两行或者三行的容器,想要纯用css实现这个方法,是没办法做到的。
可以提供两种方法,一是用程序输出时截字,二是用js判断字数截取。
热心网友
.pTwoLine{
white-space:initial;
overflow : hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
}
关键词-webkit-line-clamp: 2;最多显示2行, text-overflow: ellipsis;超过2行...