基础 CSS 标注着色

Foundation CSS是由 ZURB 基金会于 2011 年 9 月构建的开源和响应式前端框架，它可以轻松布局令人惊叹的响应式网站、应用程序和电子邮件，这些网站、应用程序和电子邮件看起来很棒并且可以在任何设备上访问。在本文中，我们将讨论如何更改使用 Foundation CSS 制作的标注的颜色。

标注将 Foundation 5 中的面板和警报组合到一个通用容器组件中。 Foundation CSS 使用

元素中的“callout”类来创建标注。要更改标注的背景颜色，我们使用基础 CSS、上下文颜色类以及“标注”类。

基础 CSS 标注着色类：

• primary：该类用于将标注的颜色设置为调色板的原色。默认颜色为蓝色。
• 次要：该类用于将标注的颜色设置为调色板的次要颜色。默认颜色为灰色。
• success：该类用于将标注的颜色设置为调色板的成功颜色。默认颜色为绿色。
• alert：此类用于将标注的颜色设置为调色板的警报颜色。默认颜色为红色。
• 警告：该类用于将标注的颜色设置为调色板的警告颜色。默认颜色为黄色。

句法：

contents...

示例：此示例演示了使用 Foundation CSS 制作的标注的所有颜色变化。

HTML

  

    
    
  
    
    

  

    
    
        GeeksforGeeks
    
    Foundation CSS Callout
    
    
    
        Primary 
        This is a basic callout.
    
    
        Secondary 
        This is a basic callout.
    
    
        Success 
        This is a basic callout.
    
    
        Alert  
        This is a basic callout.
    
    
        Warning 
        This is a basic callout.
     

输出：