// 文本样式 @use 'mixins/function' as *; @use 'mixins/mixins' as *; /* 文本尺寸 start */ @include b('text') { @each $size in ('default', 'xs', 'sm', 'lg', 'xl', '2xl', '3xl', '4xl') { $classname: if($size == 'default', '', '-' + $size); &#{$classname} { font-size: getCssVar('font-size', if($size == 'default', '', $size)); } } } /* 文本尺寸 end */ // 字体变成大写 .#{bem('text-uppercase')} { text-transform: uppercase; } // 字体变成小写 .#{bem('text-lowercase')} { text-transform: lowercase; } // 字体变成首字母大写 .#{bem('text-capitalize')} { text-transform: capitalize; } // 字体加粗 .#{bem('text-bold')} { font-weight: bold; } // 字体居中 .#{bem('text-center')} { text-align: center; } // 字体居左 .#{bem('text-left')} { text-align: left; } // 字体居右 .#{bem('text-right')} { text-align: right; } // 如果需要使用用省略号隐藏更多的内容,对应的容器需要设置宽度 [class*=#{bem('text-ellipsis')}] { width: 100%; } @for $i from 1 through 5 { .#{bem('text-ellipsis-' + $i)} { @if ($i == '1') { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } @else { display: -webkit-box; overflow: hidden; text-overflow: ellipsis; word-wrap: break-word; -webkit-line-clamp: $i; -webkit-box-orient: vertical !important; } } } // 透明字体 .#{bem('text-transparent')} { -webkit-background-clip: text; background-clip: text; color: transparent !important; } // 换行 .#{bem('break-word')} { word-wrap: break-word; }