一系列实用的工具类,用于快速设置颜色、文本、字体和尺寸等样式。
| 浅色背景颜色 | 文本颜色 | 背景颜色 | 边框颜色 |
| .primary | .text-primary | .bg-primary | .border-primary |
| .success | .text-success | .bg-success | .border-success |
| .info | .text-info | .bg-info | .border-info |
| .warning | .text-warning | .bg-warning | .border-warning |
| .danger | .text-danger | .bg-danger | .border-danger |
| 文本颜色 | 背景颜色 | 边框颜色 |
| .text-teal | .bg-teal | .border-teal |
| .text-blue | .bg-blue | .border-blue |
| .text-indigo | .bg-indigo | .border-indigo |
| .text-purple | .bg-purple | .border-purple |
| .text-red | .bg-red | .border-red |
| .text-maroon | .bg-maroon | .border-maroon |
| .text-orange | .bg-orange | .border-orange |
| .text-yellow | .bg-yellow | .border-yellow |
| .text-brown | .bg-brown | .border-brown |
| .text-green | .bg-green | .border-green |
使用方法
| 类 | 描述 |
| .text-left | 文字居左 |
| .text-center | 文字居中 |
| .text-right | 文字居右 |
| .text-justify | 两端对齐 |
| .text-break | 强制断行 |
| .text-nowrap | 强制不换行 |
| .text-hide | 文本隐藏 |
| .text-lowercase | 转化为小写 |
| .text-uppercase | 转化为大写 |
| .text-capitalize | 首字母转化为大写 |
| 类 | 描述 |
| .font-sans | 非衬线字体(黑),通常在标题使用。 |
| .font-serif | 衬线字体(宋),通常在正文使用。 |
| .font-cursive | 手写体(楷),通常在横幅使用。 |
| .font-monospace | 等宽字体,通常在代码使用。 |
使用方法
| 外边距 | 内边距 |
| .m-{size} | .p-{size} |
| .ml-{size} | .pl-{size} |
| .mr-{size} | .pr-{size} |
| .mt-{size} | .pt-{size} |
| .mb-{size} | .pb-{size} |
| .mx-{size} | .px-{size} |
| .my-{size} | .py-{size} |
其中 {size} 可以为 0, 1, 2, 3, 4, 5, 6