Css显示省略号

最新推荐文章于 2024-09-19 08:00:00 发布

new Vue()

最新推荐文章于 2024-09-19 08:00:00 发布

阅读量4.2k

点赞数 2

文章标签： css css3 html

本文链接：https://blog.csdn.net/qq_45444035/article/details/125008069

版权

单行省略号

width:100px; //设置宽度
max-width:200px; //也可以设置最大宽度
overflow: hidden;//溢出隐藏
white-space: nowrap; // 强制一行显示
text-overflow: ellipsis;// 显示。。。省略号

多行省略号

    width: 100px; //设置宽度
    max-width:200px; //也可以设置最大宽度
	overflow : hidden;  // 溢出隐藏
	display: -webkit-box;    //  自适应布局 弹性伸缩盒子
	-webkit-box-orient: vertical; //垂直排列子元素 伸缩盒子的子元素排列
	-webkit-line-clamp: 3;   //最多显示几行 多出部分。。。显示
	text-overflow: ellipsis; // 显示省略号