W3.CSS Color Metro UI

---

Windows Metro UI

Metro 是 Microsoft Design Language (MDL) 的昵称。

Metro 专注于排版、简化图标和现代色彩。

这个例子展示了如何在 W3.CSS 中使用 Windows Metro 的颜色:

实例

<div class="w3-metro-light-green">
  <p>伦敦是英国人口最多的城市，
  拥有超过 900 万居民的大都市区。</p>
</div>

亲自试一试 »  Download the CSS »

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-light-green

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-green

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-dark-green

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-magenta

---

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-light-purple

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-purple

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-dark-purple

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-darken

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-teal

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-light-blue

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-blue

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-dark-blue

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-yellow

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-orange

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-dark-orange

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-red

伦敦

伦敦是英国人口最多的城市，其都市区人口超过900万。

Try It

w3-metro-dark-red