📜  引导程序4 |版式

📅  最后修改于: 2021-05-25 16:37:08             🧑  作者: Mango

排版是Bootstrap的一项功能,用于样式化和格式化文本内容。它用于创建自定义的标题,内联子标题,列表,段落,对齐方式,添加更多面向设计的字体样式等等。 Bootstrap支持字体集,标题和链接样式的全局设置,这些设置将在Web应用程序中用于每种类型的OS和设备,以提供最佳的用户界面。

印刷术可用于创建:

  • 标题
  • 副标题
  • 文字和段落字体的颜色,字体类型和对齐方式
  • 清单
  • 其他内联元素

用于在引导程序中实现排版功能的标签和类:

  • 显示标题:用于创建更好的标题(更大的字体大小和更轻的字体粗细)。显示标题中存在四类,分别是.display-1,.display-2,.display-3和.display-4。
  • 线索:用于使段落突出,即在视觉上更好。
  • 标记:用于突出显示文本内容。
  • 字母缩写用于以较小的文本大小显示缩写。
  • blockquote:用于引用文本内容。
  • blockquote-footer:用于添加页脚详细信息以标识报价的来源。
  • 文本中心:用于将文本与中心对齐。
  • list-inline:用于使list元素内联。
  • text-truncate:用于通过截短省略号来缩短较长的文本。
  • 文本静音:用于文本颜色,文本静音使文本褪色,即文本变灰。
  • 文本大写:用于将文本转换为大写。
  • 文本小写:用于将文本转换为小写。
  • text-capitalize:用于转换文本以大写每个单词的第一个字母,而将其他字母小写。
  • .font-weight-bold:将字体粗细设置为粗体。它用于显示文本的重要性。
  • .font-weight-bolder:将字体粗细设置为深黑。它用于显示文本的重要性。
  • .font-italic:将字体样式设置为斜体。
  • .font-weight-light:将字体粗细设置为light。
  • .font-weight-lighter:设置较浅的字体粗细。
  • .font-weight-normal:设置普通字体的大小和粗细。
  • .lead:它使该段突出。
  • .small:用于创建辅助子标题。
  • .text-left:设置文本的左对齐。
  • .text-*-left:在所有屏幕(小,中,大或xlarge)上设置文本的左对齐。
  • .text-break:将长字符串文本分成短文本子字符串。

示例1:此示例使用标题类显示标题。



      

    
        Bootstrap Typography example
    
    
    
    
    
      
    
    
    
    

  

    
        

Heading Lists

        

GeeksforGeeks

        

GeeksforGeeks

        

GeeksforGeeks

        

GeeksforGeeks

    
  

输出:

示例2:此示例使用标记显示文本的重要性。



      

    
        Bootstrap Typography example
    
    
    
    
    
      
    
    
    
    

  

    
        

GeeksforGeeks

             

A computer science portal for geeks

    

输出: