Bootstrap 4 中有多少种颜色可用？

Bootstrap 4 支持 10 种不同的颜色实用程序类，可用于文本和背景颜色。这些颜色中的每一种都有一个名称，可用于描述页面上颜色的使用。

颜色实用程序文本类：这些类用于更改文本的颜色。

• text-primary：它为文本赋予天蓝色。
• text-secondary：它使文本呈灰色。
• 文本警告：它为文本提供黄色阴影。
• text-success：它为文本赋予绿色。
• text-danger：它为文本赋予红色。
• text-muted：它为文本提供灰色。
• text-dark：它为文本提供深黑色。
• text-light：它为文本提供非常浅的灰色。
• text-info：它为文本提供蓝色阴影。
• text-white：它为文本赋予白色。

示例：此示例显示使用所有颜色实用程序类为页面上的文本着色。

HTML

    


  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
    
      Welcome to geeksforgeeks
    
  
  
   
   
  
  
  
  

输出：

颜色实用程序背景类：这些类用于更改背景的颜色。当尝试使用颜色工具类作为背景时，“text”被替换为“bg”，它代表“background”。

背景颜色的颜色实用程序类是：

• bg-primary：它为元素的背景赋予天蓝色。
• bg-secondary ：它为元素的背景赋予灰色。
• bg-warning：它为元素的背景提供黄色阴影。
• bg-success：它为元素的背景赋予绿色。
• bg-danger：它为元素的背景赋予红色。
• bg-muted：它为元素的背景赋予灰色。
• bg-dark：它为元素的背景赋予深黑色。
• bg-light：它为元素的背景赋予非常浅的灰色。
• bg-info：它为元素的背景提供蓝色阴影。
• bg-white：它为元素的背景赋予白色。

示例：此示例显示了使用所有颜色实用程序类为页面上的背景着色。

HTML

    


  
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
    
        Welcome to geeksforgeeks
    
  
   
   
  
  
  
  

输出：