免費(fèi)AI編程助手
W3.CSS Color (主題)
2020-11-10 17:18 更新
顏色主題
W3.CSS，它很容易定制您的應(yīng)用程序的顏色主題。
Movies 2014
Frozen
人們對(duì)動(dòng)畫的反應(yīng)很荒謬人們對(duì)動(dòng)畫的反應(yīng)很荒謬
The Fault in Our Stars
感人、扣人心弦、制作精良
The Avengers
這是漫威和迪士尼的巨大成功
<<>>
Movies 2014
Frozen
人們對(duì)動(dòng)畫的反應(yīng)很荒謬人們對(duì)動(dòng)畫的反應(yīng)很荒謬
The Fault in Our Stars
感人、扣人心弦、制作精良
The Avengers
這是漫威和迪士尼的巨大成功
<<>>
你所要做的就是添加一個(gè)鏈接到預(yù)定義的(或自制的)主題:
預(yù)定義的主題
這些是W3.CSS中預(yù)定義的主題:
w3-theme-紅色
w3-theme-粉色
w3-theme-紫色
w3-theme-深紫色
w3-theme-靛藍(lán)色
w3-theme-藍(lán)色
w3-theme-淺藍(lán)色
w3-theme-青色
w3-theme-青綠色
w3-theme-綠色
w3-theme-淺綠色
w3-theme-石灰色
w3-theme-卡其色
w3-theme-黃色
w3-theme-琥珀色
w3-theme-橙色
w3-theme-深橙色
w3-theme-藍(lán)灰色
w3-theme-棕色
w3-theme-灰色
w3-theme-暗灰色
w3-theme-黑色
添加漸變
一位讀者向我們提出了這樣的建議:你可以考慮為每個(gè)主題添加一個(gè)漸變。
我使用了藍(lán)色主題中的l2和l1顏色來創(chuàng)建這個(gè)漸變:
實(shí)例
.w3-theme-gradient {
color: #000 !important;
background:-webkit-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-moz-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-o-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-ms-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background: linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
color: #000 !important;
background:-webkit-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-moz-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-o-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background:-ms-linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
.w3-theme-gradient {
color: #000 !important;
background: linear-gradient(top,#64B5F6 25%,#42A5F5 75%) }
嘗試一下 ?
可下載的顏色主題
以下是一些受谷歌材料設(shè)計(jì)啟發(fā)而下載的色彩主題:
| 樣式表 | 描述 |
| w3-theme-amber.css | 顏色主題：琥珀色
|
| w3-theme-black.css | 顏色主題：黑色
|
| w3-theme-blue.css | 顏色主題：藍(lán)色
|
| w3-theme-blue-grey.css | 顏色主題：藍(lán)灰色
|
| w3-theme-brown.css | 顏色主題：棕色
|
| w3-theme-cyan.css | 顏色主題：青色
|
| w3-theme-dark-grey.css | 顏色主題：暗灰色
|
| w3-theme-deep-orange.css | 顏色主題：深橙色
|
| w3-theme-deep-purple.css | 顏色主題：深紫色
|
| w3-theme-green.css | 顏色主題：綠色
|
| w3-theme-grey.css | 顏色主題：灰色
|
| w3-theme-indigo.css | 顏色主題：靛藍(lán)色
|
| w3-theme-khaki.css | 顏色主題：卡其色
|
| w3-theme-light-blue.css | 顏色主題：藍(lán)色
|
| w3-theme-light-green.css | 顏色主題：綠色
|
| w3-theme-lime.css | 顏色主題：石灰色
|
| w3-theme-orange.css | 顏色主題：橙色
|
| w3-theme-pink.css | 顏色主題：粉色
|
| w3-theme-purple.css | 顏色主題：紫色
|
| w3-theme-red.css | 顏色主題：紅色
|
| w3-theme-teal.css | 顏色主題：青綠色
|
| w3-theme-yellow.css | 顏色主題：黃色
|
以上內(nèi)容是否對(duì)您有幫助：
更多建議：