本教程操作环境:windows10系统、css3版、DELL G3电脑css怎么实现三个点隐藏?CSS文字溢出隐藏为三个点…(1)单行white-space: nowrap;//不换行 text-overflow: ellipsis;//将
本教程操作环境:windows10系统、css3版、DELL G3电脑
css怎么实现三个点隐藏?
CSS文字溢出隐藏为三个点…
(1)单行
white-space: nowrap;//不换行
text-overflow: ellipsis;//将文本溢出显示为(…)
overflow: hidden;//溢出隐藏。
(2)多行
overflow: hidden;
text-overflow: ellipsis;
display: -WEBkit-box;
-webkit-line-clamp: 3;
-webkit-box-orient: vertical;
注:text-overflow 属性指定当文本溢出包含它的元素时,应该如何显示。可以设置溢出后,文本被剪切、显示省略号 (...) 或显示自定义字符串(不是所有浏览器都支持)。
text-overflow 需要配合以下两个属性使用:
white-space: nowrap;
overflow: hidden;
语法
text-overflow: clip|ellipsis|string|initial|inherit;
值
clip 剪切文本。
ellipsis 显示省略符号 ... 来代表被修剪的文本。
string 使用给定的字符串来代表被修剪的文本。
initial 设置为属性默认值。
inherit 从父元素继承该属性值。
以上就是css怎么实现三个点隐藏的详细内容,更多请关注编程网其它相关文章!
--结束END--
本文标题: css怎么实现三个点隐藏
本文链接: https://www.lsjlt.com/news/206922.html(转载时请注明来源链接)
有问题或投稿请发送至: 邮箱/279061341@qq.com QQ/279061341
下载Word文档到电脑,方便收藏和打印~
2023-05-25
2023-05-25
2023-05-25
2023-05-25
2023-05-25
2023-05-24
2023-05-24
2023-05-24
2023-05-24
2023-05-24
回答
回答
回答
回答
回答
回答
回答
回答
回答
回答
0