Getting startedAccessibility（无障碍）Browsers and devices（浏览器和设备）Build tools（构建工具）Contents（内容）Download（下载）JavaScriptTheming Bootstrap（主题Bootstrap）WebpackComponents: AlertsAlerts（警报）Components: BadgesBadges（徽章）Components: BreadcrumbBreadcrumbComponents: Button groupButton group（按钮组）Components: ButtonsButtons（按钮）Components: CardsComponents: CarouselCards（卡）Carousel（圆盘传送带）Components: CollapseCollapse（折叠）Components: DropdownsDropdowns（下拉菜单）Components: FormsForms（表单）Components: Input groupInput group（输入群组）Components: Input groupJumbotron（广告大屏幕）Components: List groupList group（列表组）Components: ModalModal（互动视窗）Components: NavbarNavbar（导航栏）Components: NavsNavs（导航栏）Components: PaginationPagination（分页）Components: PopoversPopovers（弹出框）Components: ProgressProgress（进度条）Components: ScrollspyScrollspy（滚动监听）Components: TooltipsTooltips（提示工具）ContentCode（代码）Figures（图片区）Images（图片）Reboot（重置）Tables（表格）Typography（排版）LayoutGrid（网格）Layout（布局）Media object（多媒体对象）Utilities for layout（排版通用类别）MigrationMigrating to v4（迁移到v4）UtilitiesBorders（边框）Clearfix（清除浮动）Close icon（关闭图标）Colors（颜色）Display property（显示属性）Embeds（内嵌）Flex（弹性）Float（浮动）Image replacement（图像替换）Position（位置）Screenreaders（荧幕阅读器）Sizing（尺寸）Spacing（间隔）Text（文本）Vertical alignment（垂直对齐）Visibility（能见度）
©
本文档使用
php.cn手册 发布
文字
常见文本工具的文档和示例，以控制对齐，包装，重量等等。
文本对齐
轻松地将文本重新对齐到具有文本对齐类的组件。
<p class="text-justify">Ambitioni dedisse scripsisse iudicaretur. Cras mattis iudicium purus sit amet fermentum. Donec sed odio operae, eu vulputate felis rhoncus. Praeterea iter est quasdam res quas ex communi. At nos hinc posthac, sitientis piros Afros. Petierunt uti sibi concilium totius Galliae in diem certam indicere. Cras mattis iudicium purus sit amet fermentum.</p>
对于左对齐，右对齐和中心对齐，可以使用与网格系统使用相同视口宽度断点的响应类。
<p class="text-left">Left aligned text on all viewport sizes.</p><p class="text-center">Center aligned text on all viewport sizes.</p><p class="text-right">Right aligned text on all viewport sizes.</p><p class="text-sm-left">Left aligned text on viewports sized SM (small) or wider.</p><p class="text-md-left">Left aligned text on viewports sized MD (medium) or wider.</p><p class="text-lg-left">Left aligned text on viewports sized LG (large) or wider.</p><p class="text-xl-left">Left aligned text on viewports sized XL (extra-large) or wider.</p>
文本换行和溢出
防止文本与.text-nowrap类一起打包。
<div class="row"> <div class="col-1 text-nowrap"> Curabitur blandit tempus ardua ridiculus sed magna. </div> <div class="col-11"> <img src="..." alt="An image to show the text doesn't wrap"> </div></div>
对于更长的内容，您可以添加一个.text-truncate类以省略号截断文本。需要display: inline-block或display: block**.**。
<!-- Block level --><div class="row"> <div class="col-2 text-truncate"> Praeterea iter est quasdam res quas ex communi. </div></div><!-- Inline level --><span class="d-inline-block text-truncate" style="max-width: 150px;"> Praeterea iter est quasdam res quas ex communi.</span>
文本转换
使用文本大写类转换组件中的文本。
<p class="text-lowercase">Lowercased text.</p><p class="text-uppercase">Uppercased text.</p><p class="text-capitalize">CapiTaliZed text.</p>
请注意，text-capitalize只更改每个单词的第一个字母，使其他字母的大小写不受影响。
字体粗细和斜体
快速更改文字的粗细或斜体文字。
<p class="font-weight-bold">Bold text.</p><p class="font-weight-normal">Normal weight text.</p><p class="font-weight-light">Light weight text.</p><p class="font-italic">Italic text.</p>