here

优质

小牛编辑

113浏览

2023-12-01

描述 (Description)

links和buttons等交互式元素使用来自SASS变量$primary-color默认蓝色阴影。组件还可以具有以下颜色:辅助，警报，成功和警告。您可以将其他颜色用于UI元素。

例子 (Example)

以下示例演示了在Foundation中使用colors 。

<html>
   <head>
      <title>Foundation Example</title>
      <link rel = "stylesheet" href = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/css/foundation.css">
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/js/vendor/jquery.min.js"></script>
      <script src = "https://cdnjs.cloudflare.com/ajax/libs/foundation/6.0.1/js/foundation.min.js"></script>
   </head>
   <body>
      <div class = "success callout">
         <p>This is success callout.</p>
      </div>
      <div class = "alert callout">
         <p>This is alert callout.</p>
      </div>
      <button class = "button">Primary Action</button>
      <button class = "button secondary">Secondary Action</button>
      <button class = "button success">Success Action</button>
      <button class = "button warning">Warning Action</button>
      <button class = "button alert">Alert Action</button>
   </body>
</html>