// Mixin flex 垂直居中布局
@mixin flex-center() {
display: flex;
flex-wrap: nowrap;
justify-content: center;
align-items: center;
}
// 三点省略 支持单行多行
// Mixin { n:Number } n:省略行数限制
@mixin ellipsis($n) {
overflow: hidden;
text-overflow: ellipsis;
@if $n>1 {
display: -webkit-box;
-webkit-line-clamp: $n;
-webkit-box-orient: vertical;
}
@else {
white-space: nowrap;
}
}
// 按钮变大效果
@mixin btn-bigger() {
transform: scale(1.2);
box-shadow: 0 8px 16px 0 rgba(0, 0, 0, .1);
}
常用css式样
于 2023-11-07 17:51:16 首次发布