跳转到内容

排版

描述

typography模块提供了广泛的类,用于在套件中样式化文本

标题

提供了许多标题样式,可用于结构化页面上的信息。他们是element-agnostic;你可以用在任何< h * >标记(甚至其他标记)——为您的特定用途选择最具语义的元素。

ipsType_pageTitle
作为页面的主标题最有用。更大的版本也可以通过添加ipsType_largeTitle类。

这是一个页面标题

ipsType_sectionTitle
页面上某一节的标题。

这是一个章节标题

ipsType_sectionHead
一个表头。

这是节标题

ipsType_minorHeading
一个不太重要的小标题。

一个小标题

对齐

ipsType_left
左对齐文本

ipsType_right
右对齐文本

ipsType_center
为中心的文本

颜色

ipsType_light
光的文本

ipsType_warningipsType_negative
警告状态文本

ipsType_success
成功状态文本

ipsType_issue
问题/中间状态的文本

ipsType_neutral
中性状态文本

分级

ipsType_small
小文本

ipsType_medium
媒介文本

ipsType_normal
正常大小

ipsType_large
大型文本

ipsType_veryLarge
非常大的文本

ipsType_huge(用于图标)

用户生成的文本/内容从CKEditor

在处理用户(通常来自CKEditor)生成的内容时,为了使其正确显示,应该使用三个类。一般情况下,您会希望使用这三种方法,尽管有些情况可能需要不同的处理方法。您可能还想将类应用于不同的元素—例如,如果您有重复的用户内容块,则ipsContained类可以应用于包装器而不是每个单独的项。在处理用户生成的内容时,一定要做到测试边界情况。

ipsType_richText
这是用户生成内容的主要类,支持响应式图像和正确边距等样式。

ipsType_break
这确保了在用户生成的内容中正确地断句

ipsType_contained
这是一种保护措施,确保内容不能扩展到给定容器之外。

删除文本

通过在元素中添加两个类,文本可以在一行中被截断:ipsTruncate ipsTruncate_line.在支持它的浏览器中,这将导致溢出文本被隐藏,并被省略号取代。

注意:此方法被设计用于处理单行上的短文本,例如按钮上的文本。它在多行字符串上不起作用;对于这些情况,您应该使用基于javascript的ips.ui.truncate小部件。为了工作,它还将元素的宽度设置为100%;如果您希望取消此行为,则需要手动设置宽度。

其他字体风格

ipsType_noBreak
防止文本换行

ipsType_reset
删除边距(对于

元素最有用)

ipsType_unbold
从文本中删除粗体样式

ipsType_uppercase
使文字大写

ipsType_blendLinks
当应用于包含链接的元素或链接本身时,将使链接匹配周围的文本样式。


报告指南


×
×
  • 创建新的…
Baidu