使用如下示例代码可以对文本进行平滑、省略符等设置.
1 | <style lang="scss"> |
See the Pen bpui-style-text by brainpoint (@brainpoint) on CodePen.
设置文字平滑.
除使用mixin外, 还可以使用内置的类
.bp-smoothing
.
1 | @include bp-smoothing(); |
设置文字单行缩略.
display属性的设置对缩略有影响; 单行缩略文本需要为
display: block
,display: inline-block
或其他flow-root等允许的值
除使用mixin外, 还可以使用内置的类
.bp-ellipsis
1 | @include bp-ellipsis(); |
设置文字多行缩略文本.
display属性的设置对缩略有影响; 多行缩略文本已经设置为
display: -webkit-box
除使用mixin外, 还可以使用内置的类
.bp-ellipsisMultiline1
,.bp-ellipsisMultiline2
, … ,.bp-ellipsisMultiline8
分别表示最大1~8行的文本缩略.
1 | @include bp-ellipsisMultiline(最大行数) |