flex布局会影响单行文字超出,省略号的显示
.text-ellipsis {
width: 300rpx;
//display: flex;
//align-items: center;
font-size: 30rpx;
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
}
单行超出省略
.text-ellipsis{
overflow:hidden;
white-space: nowrap;
text-overflow: ellipsis;
-o-text-overflow:ellipsis;
}
多行超出省略
text-ellipsis{
overflow:hidden;
text-overflow: ellipsis;
-webkit-line-clamp: 3;
display: -webkit-box;
-webkit-box-orient: vertical;
}
grid布局
display: grid;
grid-template-columns: 1fr 1fr; // 每一行显示多少个
grid-column-gap: 20px; // 列间隔
grid-row-gap: 18px; // 行间隔
flex布局不等高设置
align-items: flex-start