Bootstrap4 颜色

￡神魔★判官ぃ 2021-09-15 01:26 578阅读 0赞

文本中和链接中的颜色是相同的

<div class="container">

<h2>代表指定意义的文本颜色</h2>  
  <p class="text-muted">柔和的文本。</p>  
  <p class="text-primary">重要的文本。</p>  
  <p class="text-success">执行成功的文本。</p>  
  <p class="text-info">代表一些提示信息的文本。</p>  
  <p class="text-warning">警告文本。</p>  
  <p class="text-danger">危险操作文本。</p>  
  <p class="text-secondary">副标题。</p>  
  <p class="text-dark">深灰色文字。</p>  
  <p class="text-light">浅灰色文本（白色背景上看不清楚）。</p>  
  <p class="text-white">白色文本（白色背景上看不清楚）。</p>

</div>

<a href="\#" class="text-muted">柔和的链接。</a>

![Image 1][]

## 背景颜色 ##

提供背景颜色的类有:  **.bg-primary** ,  **.bg-success** ,  **.bg-info** ,  **.bg-warning** ,  **.bg-danger** ,  **.bg-secondary** ,  **.bg-dark** 和  **.bg-light** 。

<div class="container">  
  <h2>背景颜色</h2>  
  <p class="bg-primary text-white">重要的背景颜色。</p>  
  <p class="bg-success text-white">执行成功背景颜色。</p>  
  <p class="bg-info text-white">信息提示背景颜色。</p>  
  <p class="bg-warning text-white">警告背景颜色</p>  
  <p class="bg-danger text-white">危险背景颜色。</p>  
  <p class="bg-secondary text-white">副标题背景颜色。</p>  
  <p class="bg-dark text-white">深灰背景颜色。</p>  
  <p class="bg-light text-dark">浅灰背景颜色。</p>

</div>

![Image 1][]

[Image 1]:

发表评论取消回复

表情：

评论列表（有 0 条评论，578人围观）

还没有评论，来说两句吧...

相关阅读

相关 Bootstrap 颜色和日期插件

BootCDN加速器： [https://www.bootcdn.cn/][https_www.bootcdn.cn] [![watermark_type_ZmFuZ3poZ

悠悠/ 2023年10月18日 17:13/ 0 赞/ 189 阅读

相关 Bootstrap文字颜色和背景颜色

Bootstrap提供了一些有代表意义的颜色类。文本颜色示例 ![在这里插入图片描述][c03eddd9895e4cf89128c62bafb02ab6.png]

ゞ浴缸里的玫瑰/ 2023年09月24日 16:57/ 0 赞/ 114 阅读

相关修改默认Bootstrap框架下导航颜色

近日开始在学习Bootstrap框架，十分强大的框架，导航默认的背景颜色和链接文本样式是白色背景和黑色的链接文本样式，调用navbar-inverse反色样式后，背景变成黑色文

r囧r小猫/ 2023年02月28日 01:30/ 0 赞/ 1 阅读

相关 bootstrap4

文章目录 1. 容器 2. 栅格系统 1. 规则 2. 平板、桌面、大桌面显示器、超大桌面显示器 3. 偏移列

﹏ヽ暗。殇╰゛Y/ 2022年03月17日 16:18/ 0 赞/ 406 阅读

相关 Bootstrap-全局样式的文本颜色,背景颜色和按钮颜色

记录学习笔记 .text-五种颜色文本颜色 .text-info文本浅蓝颜色-提示 .text-warning文本黄色-警告颜色 .t

不念不忘少年蓝@/ 2022年02月21日 07:06/ 0 赞/ 453 阅读

相关 bootstrap4中文文档 bootstrap4中文版入门教程手册

bootstrap4中文文档 bootstrap4中文版入门教程手册欢迎访问，之前在网上没找到中文版的教程，这个整理的不错，很适合新手入门。 [https://ww

╰+哭是因爲堅強的太久メ/ 2022年02月20日 07:16/ 0 赞/ 610 阅读

相关修改bootstrap 滚轴颜色

-webkit-scrollbar { width: 12px;} -webkit-scrollbar-track { -webkit-box-shado

快来打我*/ 2021年10月08日 06:52/ 0 赞/ 395 阅读

相关 Bootstrap4 教程

Bootstrap4教程导航 <table> <tbody> <tr> <td><a href="http://codingdict.com/artic

﹏ヽ暗。殇╰゛Y/ 2021年09月21日 01:42/ 0 赞/ 605 阅读

相关 Bootstrap4 小工具

<style> .border \{ display: inline-block; width: 70px; height: 70

「爱情、让人受尽委屈。」/ 2021年09月15日 01:58/ 0 赞/ 519 阅读

相关 Bootstrap4 颜色

文本中和链接中的颜色是相同的 <div class="container"> <h2>代表指定意义的文本颜色</h2> <p class="text-muted

￡神魔★判官ぃ/ 2021年09月15日 01:26/ 0 赞/ 579 阅读