锐客网

  1. 首页 > 睿知 > it技术 > >

bootstrap排版

Bootstrap教程bootstrap排版

本文概述

  • 文字对齐
  • 文字转换
  • 字体粗细和斜体
排版提供了一些实用程序，可为文本添加其他样式。
这些实用程序是：
  • 文字对齐
  • 文字转换
  • 字体粗细和斜体
文字对齐文本对齐用于通过文本对齐类轻松地将文本重新对齐到组件。
句法：
左对齐文本：
< p class="text-left">Left aligned text.< /p>

对齐文字中心：
< p class="text-center">Center aligned text.< /p>

右对齐文本：
< p class="text-right">Right aligned text.< /p>

对齐文本对齐：
< p class="text-justify">Justified text.< /p>

对齐文本不换行：
< p class="text-nowrap">No wrap text.< /p>

你还可以根据其大小在视口上对齐文本。
大小为SM（较小）或较大的视口上的左对齐文本。
< p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.< /p>

在视口大小为MD（中）或更宽的视口上左对齐文本。
< p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.< /p>

在大小为LG（大）或更宽的视口上左对齐文本。
< p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.< /p>

大小为XL（超大）或更大的视口上的左对齐文本。
< p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.< /p>

文字转换【bootstrap排版】文本大写类用于在组件中转换文本。
对于小写文本：
使用“ text-lowercase”类使文本以小写形式显示。
句法：
< p class="text-lowercase">Lowercased text.< /p>

输出：
lowercased text.

对于大写文本：
使用“ text-uppercase”类使文本以大写形式显示。
句法：
< p class="text-uppercase">Uppercased text.< /p>

输出：
UPPERCASED TEXT.

大写字母：
使用“文本大写”类使文本的第一个字母大写。
句法：
< p class="text-capitalize">CapiTaliZed text.< /p>

输出：
CapiTaliZed Text.

字体粗细和斜体它用于快速更改文本的粗细（粗体）或斜体文本。
对于粗体文本：
使用“ font-weight-bold”类将文本粗体设置为粗体。
句法：
< p class="font-weight-bold">Bold text.< /p>

输出：
Bold text.

对于普通重量文本：
使用“ font-weight-normal”类使文本正常粗细。
句法：
< p class="font-weight-normal">Normal weight text.< /p>

输出：
Normal weight text.

对于斜体文字：
使用“ font-italic”类使文本变为斜体。
句法：
< p class="font-italic">Italic text.< /p>

    推荐阅读


    上一篇：bootstrap间距spacing

    下一篇：bootstrap分级sizing