文本和排版
控制文本大小,对齐,包装,溢出,转换和更多。默认情况下,Vuetify 使用材料设计规范 Roboto Font.
Typography (排版)
使用 Typography 帮助器类控制文本的大小和样式。这些值是基于Material Design type specification.
Breakpoints (断点)
所有的排版类都支持框架中其他部分的响应式断点。基类.text-{value}
对应于xsAndUp
断点,而类.text-{breakpoint}-{value}
可用于其余的断点(sm
, md
, lg
和xl
)。
下面的例子展示了一个稍微做作的例子,说明如何使用不同的类来实现效果:
Font emphasis (强调字体)
Material 设计, 默认情况下, 支持 100, 300, 400, 500, 700, 900 字体宽度和斜体文本。
Text (文本)
Alignment (对齐)
Alignment 助手类允许你轻松的创建 re-align 文本。
对齐类还支持响应式断点。
Decoration (装饰线)
使用 .text-decoration-none
移除文本装饰线或使用.text-decoration-overline
, .text-decoration-underline
, 和 .text-decoration-line-through
.添加一个 overline, underline or line-through (上划线, 下划线或删除线)。
Opacity (不透明度)
不透明度辅助类允许您轻松调整文本的强调。text-high-emphasis
的文本与默认文本具有相同的不透明度。text-medium-emphasis
用于提示和辅助文本。text-disabled
用于不再强调文本。
变形
文本 capitalization 类可以转换文字的大小写。
文本断行和删除text-transform
也是可能的。在第一个示例中,text-transform: uppercase
自定义类被覆盖,并允许保留文本的大小写。在第二个例子中,我们将一个较长的单词拆分以适应可用空间。
Wrapping and overflow (文本换行和溢出)
您可以使用 .text-no-wrap
工具类来防止文本换行.
可以使用.text-truncate
实用程序类使用文本省略号截断较长的内容。
INFO
需要 display: inline-block
或 display: block
.
RTL Alignment (对齐)
使用RTL时 ,无论当前文本方向如何,您都可能希望保持对齐方式。这可以通过将方向设置为left
or right
来实现。
如果您希望对齐方式响应当前文本方向,请使用 use start
和end
.