Tema Warna W3.CSS
Tema Warna
Dengan W3.CSS, mudah untuk menyesuaikan aplikasi Anda dengan tema warna.
Film 2014
-
Beku
Tanggapan terhadap animasi itu konyol
-
Kesalahan pada Bintang Kita
Menyentuh, mencengkeram, dan dibuat dengan sangat baik
-
Penuntut balas
Sukses besar untuk Marvel dan Disney
Film 2014
-
Beku
Tanggapan terhadap animasi itu konyol
-
Kesalahan pada Bintang Kita
Menyentuh, mencengkeram, dan dibuat dengan sangat baik
-
Penuntut balas
Sukses besar untuk Marvel dan Disney
Yang harus Anda lakukan adalah menambahkan tautan ke tema yang telah ditentukan (atau buatan sendiri):
Contoh
<link rel="stylesheet"
href="https://www.w3schools.com/w3css/4/w3.css">
<link rel="stylesheet"
href="https://www.w3schools.com/lib/w3-theme-indigo.css">
Tema yang telah ditentukan sebelumnya
Ini adalah tema yang telah ditentukan di W3.CSS:
| w3-tema-merah | |
| w3-tema-merah muda | |
| w3-tema-ungu | |
| w3-tema-ungu tua | |
| w3-tema-indigo | |
| w3-tema-biru | |
| w3-tema-biru muda | |
| w3-tema-cyan | |
| w3-tema-teal | |
| w3-tema-hijau | |
| w3-tema-hijau muda | |
| w3-tema-lime | |
| w3-tema-khaki | |
| w3-tema-kuning | |
| w3-tema-kuning | |
| w3-tema-oranye | |
| w3-tema-oranye-dalam | |
| w3-tema-biru-abu-abu | |
| w3-tema-coklat | |
| w3-tema-abu-abu | |
| w3-tema-abu-abu tua | |
| w3-tema-hitam | |
| w3-tema-w3schools |
Menambahkan Gradien
Seorang pembaca mengirimkan saran ini kepada kami: Anda mungkin ingin mempertimbangkan untuk menambahkan gradien untuk setiap tema.
Saya menggunakan warna l2 dan l1 dari tema biru untuk membuat gradien ini:
Contoh
.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%)}
Tema Warna yang Dapat Diunduh
Berikut adalah beberapa tema warna yang dapat diunduh yang terinspirasi oleh Desain Material Google:
| Lembar Gaya | Keterangan |
|---|---|
| w3-tema-amber.css | Warna Tema Kuning |
| w3-tema-hitam.css | Warna Tema Hitam |
| w3-tema-biru.css | Warna Tema Biru |
| w3-tema-biru-abu-abu.css | Warna Tema Biru Abu-abu |
| w3-tema-coklat.css | Warna Tema Coklat |
| w3-tema-cyan.css | Warna Tema Cyan |
| w3-tema-abu-abu-gelap.css | Tema Warna Abu-abu Gelap |
| w3-theme-deep-orange.css | Tema Warna Oranye Tua |
| w3-tema-dalam-ungu.css | Tema Warna Ungu Tua |
| w3-tema-hijau.css | Warna Tema Hijau |
| w3-tema-abu-abu.css | Warna Tema Abu-abu |
| w3-tema-indigo.css | Warna Tema Indigo |
| w3-tema-khaki.css | Warna Tema Khaki |
| w3-tema-biru muda.css | Warna Tema Biru Muda |
| w3-tema-hijau muda.css | Warna Tema Hijau Muda |
| w3-theme-lime.css | Warna Tema Jeruk Nipis |
| w3-tema-oranye.css | Warna Tema Oranye |
| w3-tema-pink.css | Warna Tema Merah Muda |
| w3-tema-ungu.css | Warna Tema Ungu |
| w3-tema-merah.css | Warna Tema Merah |
| w3-tema-teal.css | Warna Tema Teal |
| w3-tema-kuning.css | Warna Tema Kuning |