dibuat Tema
Tema Dalam Penggunaan:
☰ Film
Beku
Tanggapan terhadap animasi konyol.
star Wars
Orang-orang keluar untuk film Star Wars baru.
Penuntut balas
Sebuah sukses besar untuk Marvel dan Disney.
CSS dihasilkan:
Cinque Terre
Cinque Terre (lima tanah) adalah bagian dari Italian Riviera. Pantai dengan lima desa: Monterosso, Vernazza, Corniglia, Manarola, dan Riomaggiore adalah Situs Warisan Dunia UNESCO.
Monterosso
Monterosso al Mare terletak di tengah teluk alami kecil, dilindungi oleh terumbu buatan kecil, di Riviera La Spezia. Ini adalah desa paling utara dari Cinque Terre.
Vernazza
Vernazza adalah satu dari lima kota di wilayah Cinque Terre. Vernazza adalah kota keempat menuju utara. Tidak memiliki lalu lintas mobil, dan merupakan salah satu yang paling benar "desa-desa nelayan" di Riviera Italia.
Tema warna
Dengan W3.CSS, mudah untuk menyesuaikan aplikasi Anda dengan tema warna Anda sendiri.
Contoh
<!DOCTYPE html>
<html>
<meta
name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet"
href="http://www.w3ii.com/lib/w3.css">
<link rel="stylesheet"
href=" /lib/w3-theme-indigo.css ">Tema yang telah ditetapkan
Dalam aplikasi HTML, Anda dapat membatasi penggunaan warna dengan memilih warna yang berbeda dari warna yang telah ditetapkan:
| w3-red | Cobalah |
| w3-merah muda | Cobalah |
| w3-ungu | Cobalah |
| w3-deep-ungu | Cobalah |
| w3-indigo | Cobalah |
| w3-biru | Cobalah |
| w3-cahaya biru | Cobalah |
| w3-cyan | Cobalah |
| w3-teal | Cobalah |
| w3-hijau | Cobalah |
| w3-lampu-hijau | Cobalah |
| w3-lime | Cobalah |
| w3-khaki | Cobalah |
| w3-kuning | Cobalah |
| w3-amber | Cobalah |
| w3-oranye | Cobalah |
| w3-dalam-oranye | Cobalah |
| w3-biru-abu-abu | Cobalah |
| w3-coklat | Cobalah |
| w3-abu | Cobalah |
| w3-abu-abu gelap | Cobalah |
| w3-hitam | Cobalah |
| w3-w3ii | Cobalah |
film 2014
Beku
Tanggapan terhadap animasi konyol
The Patahan di Stars kami
Menyentuh, mencengkeram dan benar-benar dibuat dengan baik
Penuntut balas
Sebuah sukses besar untuk Marvel dan Disney
film 2014
Beku
Tanggapan terhadap animasi konyol
The Patahan di Stars kami
Menyentuh, mencengkeram dan benar-benar dibuat dengan baik
Penuntut balas
Sebuah sukses besar untuk Marvel dan Disney
Tema pribadi
Dengan W3.CSS, mudah untuk menyesuaikan aplikasi dengan tema warna pribadi.
Anda dapat link ke tema pribadi dalam <link> tag, atau Anda dapat menempatkan tema pribadi dalam tag <style>:
Contoh
<style>
.w3-theme {
color:#fff !important;background-color:#3f51b5
!important}
.w3-theme-light {
color:#000 !important;background-color:#e8eaf6
!important}
.w3-theme-dark {
color:#fff !important;background-color:#1a237e
!important}
.w3-theme-l5 {
color:#000 !important;background-color:#e8eaf6
!important}
.w3-theme-l4 {
color:#000 !important;background-color:#c5cae9
!important}
.w3-theme-l3 {
color:#000 !important;background-color:#9fa8da
!important}
.w3-theme-l2 {
color:#fff !important;background-color:#7986cb
!important}
.w3-theme-l1 {
color:#fff !important;background-color:#5c6bc0
!important}
.w3-theme-d1 {
color:#fff !important;background-color:#3949ab
!important}
.w3-theme-d2 {
color:#fff !important;background-color:#303f9f
!important}
.w3-theme-d3 {
color:#fff !important;background-color:#283593
!important}
.w3-theme-d4 {
color:#fff !important;background-color:#1a237e
!important}
.w3-theme-action {
color:#fff !important;background-color:#311b92
!important}
.w3-text-theme {
color:#1a237e !important}
</style>menambahkan Gradien
Salah satu pembaca mengirimkan saran ini: Anda mungkin ingin mempertimbangkan untuk menambahkan gradient untuk setiap tema.
Saya menggunakan l2 dan l1 warna 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
Berikut adalah beberapa tema warna-download terinspirasi oleh Desain Bahan Google:
| Style Sheet | Deskripsi |
|---|---|
| w3-tema-amber.css | Warna Tema Amber |
| w3-tema-black.css | Warna Tema Hitam |
| w3-tema-blue.css | Warna Tema Biru |
| w3-tema-biru-grey.css | Warna Tema Biru Abu-abu |
| w3-tema-brown.css | Warna Tema Brown |
| w3-tema-cyan.css | Warna Tema Cyan |
| w3-tema-gelap grey.css | Warna Tema Dark Grey |
| w3-tema-deep-orange.css | Warna Tema Jauh Jeruk |
| w3-tema-deep-purple.css | Warna Tema Deep Purple |
| w3-tema-green.css | Warna Tema Hijau |
| w3-tema-grey.css | Warna Tema Abu-abu |
| w3-tema-indigo.css | Warna Tema Indigo |
| w3-tema-khaki.css | Warna Tema Khaki |
| w3-tema-light-blue.css | Warna Tema Light Blue |
| w3-tema-light-green.css | Warna Tema Cahaya Hijau |
| w3-tema-lime.css | Warna Lime Tema |
| w3-tema-orange.css | Warna Tema Jeruk |
| w3-tema-pink.css | Warna Tema pink |
| w3-tema-purple.css | Warna Tema Purple |
| w3-tema-red.css | Warna Tema Merah |
| w3-tema-teal.css | Warna Teal Tema |
| w3-tema-yellow.css | Warna Tema Kuning |