Css单行省略号
.ellipsis {
white-space: nowrap; /* 不换行 */
overflow: hidden; /* 超出部分隐藏 */
text-overflow: ellipsis; /* 显示省略号 */
}
Css多行省略号
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
overflow: hidden;
text-overflow: ellipsis;
Flex布局导致省略号无效
.content{display:flex}
.content .left{width:200rpx}
.content .right{flex: 1; min-width: 0;}
.content .right .title{
line-height: 38rpx;
height:38rpx;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
免费教程
这个时代变化飞快,唯有不断提升自己,才能跟上时代的步伐。自我成长最直观有效的方式就是掌握一项新技能。烹饪、书法、摄影等等都好,只要你精益求精、持续进步,自然能收获良多。
0
本文标签: