bootstrap contains many text classes: ".text-muted", ".text-primary", ".text-success", ".text-info", ".text-warning", " .text-danger", ".small", etc.
The operating environment of this tutorial: Windows 7 system, bootsrap version 3.3.7, DELL G3 computer
Source code:
Running effect:
Description:
Text color class
below Different classes display different text colors. If the text is a link, the text will darken when the mouse is moved over it:
Category | Description |
---|---|
.text -muted | "text-muted" Text style of class |
.text-primary | "text -primary" class text style |
.text-success | "text-success" class text style |
.text-info | Text style of "text-info" class |
.text-warning | Text style of "text-warning" class |
.text-danger | "text-danger " Class text style |
Text layout class
Class | Description |
---|---|
.small | Set small text (set to 85% of the size of the parent text) |
.text-left | Set text left alignment |
.text-center | Set text center alignment |
. text-right | Set text right alignment |
.text-justify | Set text alignment, and the text in the paragraph that exceeds the screen will wrap automatically |
.text-nowrap | The portion of the paragraph that exceeds the screen will not wrap |
.text-lowercase | Set text lowercase |
.text-uppercase | Set text uppercase |
.text-capitalize | Set the first letter of a word to be capitalized |
Others:
Category | Description |
---|---|
.text-hide | Replace the text content contained in the page element with the background image |
More about For relevant knowledge about bootstrap, please visit: bootstrap basic tutorial! !
The above is the detailed content of There are several text classes in bootstrap. For more information, please follow other related articles on the PHP Chinese website!