W3.CSS Color Themes
အရောင်အပြင်အဆင်များ
W3.CSS ဖြင့်၊ ၎င်းသည် သင့်အပလီကေးရှင်းများကို အရောင်အပြင်အဆင်များဖြင့် စိတ်ကြိုက်ပြင်ဆင်ရန် လွယ်ကူသည်။
ရုပ်ရှင်များ 2014
-
ဖြူဖြူ
ကာတွန်းကားတွေအပေါ် တုံ့ပြန်မှုက ရယ်စရာကောင်းတယ်။
-
ကျွန်ုပ်တို့၏ကြယ်များထဲမှ အမှား
ထိထိမိမိ ဆုပ်ကိုင်ထားပြီး စစ်မှန်စွာ ကောင်းမွန်စွာ ပြုလုပ်ထားပါသည်။
-
လက်စားချေသူများ
Marvel နဲ့ Disney အတွက် ကြီးမားတဲ့ အောင်မြင်မှုတစ်ခုပါ။
ရုပ်ရှင်များ 2014
-
ဖြူဖြူ
ကာတွန်းကားတွေအပေါ် တုံ့ပြန်မှုက ရယ်စရာကောင်းတယ်။
-
ကျွန်ုပ်တို့၏ကြယ်များထဲမှ အမှား
ထိထိမိမိ ဆုပ်ကိုင်ထားပြီး စစ်မှန်စွာ ကောင်းမွန်စွာ ပြုလုပ်ထားပါသည်။
-
လက်စားချေသူများ
Marvel နဲ့ Disney အတွက် ကြီးမားတဲ့ အောင်မြင်မှုတစ်ခုပါ။
သင်လုပ်ရမည့်အရာမှာ ကြိုတင်သတ်မှတ်ထားသော (သို့မဟုတ် အိမ်လုပ်) အပြင်အဆင်သို့ လင့်ခ်တစ်ခုထည့်ပါ-
ဥပမာ
<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">
ကြိုတင်သတ်မှတ်ထားသော အပြင်အဆင်များ
ဤအရာများသည် W3.CSS တွင် ကြိုတင်သတ်မှတ်ထားသည့် အပြင်အဆင်များဖြစ်သည်-
| w3-အပြင်အဆင်-အနီရောင် | |
| w3-အပြင်အဆင်-ပန်းရောင် | |
| w3-အပြင်အဆင်-ခရမ်းရောင် | |
| w3-အပြင်အဆင်-ခရမ်းရောင် | |
| w3-အပြင်အဆင်-မဲနယ် | |
| w3-အပြင်အဆင်-အပြာ | |
| w3-အပြင်အဆင်-အပြာနုရောင် | |
| w3-အပြင်အဆင်-စိမ်းပြာရောင် | |
| w3-ဇာတ်ဝင်-စိမ်းပြာရောင် | |
| w3-အပြင်အဆင်-အစိမ်းရောင် | |
| w3-အပြင်အဆင်-အစိမ်းဖျော့ | |
| w3-ဇာတ်ဝင်-ထုံး | |
| w3-theme-khaki | |
| w3-အပြင်အဆင်-အဝါရောင် | |
| w3-အပြင်အဆင်-ပယင်း | |
| w3-အပြင်အဆင်-လိမ္မော်ရောင် | |
| w3-theme-deep-လိမ္မော်ရောင် | |
| w3-အပြင်အဆင်-အပြာ-မီးခိုး | |
| w3-အပြင်အဆင်-အညိုရောင် | |
| w3-အပြင်အဆင်-မီးခိုးရောင် | |
| w3-အပြင်အဆင်-အမှောင်-မီးခိုး | |
| w3-အပြင်အဆင်-အနက်ရောင် | |
| w3-theme-w3schools |
Gradients ထည့်ခြင်း။
စာဖတ်သူတစ်ဦးက ကျွန်ုပ်တို့ထံ ဤအကြံပြုချက်ကို ပေးပို့ခဲ့သည်- အပြင်အဆင်တစ်ခုစီအတွက် gradient တစ်ခုထည့်ရန် စဉ်းစားလိုပေမည်။
ဤ gradient ကိုဖန်တီးရန် အပြာရောင် အပြင်အဆင်မှ l2 နှင့် l1 အရောင်များကို အသုံးပြုခဲ့သည်
ဥပမာ
.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%)}
ဒေါင်းလုဒ်လုပ်နိုင်သော အရောင်အပြင်အဆင်များ
Google ၏ Material Design ဖြင့် ဒေါင်းလုဒ်လုပ်နိုင်သော အရောင်အခင်းအကျင်းအချို့ ဖြစ်သည်-
| ပုံစံစာရွက် | ဖော်ပြချက် |
|---|---|
| w3-theme-amber.css | အရောင်အပြင်အဆင် Amber |
| w3-theme-black.css | အရောင်အပြင်အဆင် အနက်ရောင် |
| w3-theme-blue.css | အရောင် အပြင်အဆင် အပြာ |
| w3-theme-blue-grey.css | အရောင်အပြင်အဆင် အပြာရောင် မီးခိုးရောင် |
| w3-theme-brown.css | အရောင်အပြင်အဆင် အညို |
| w3-theme-cyan.css | အရောင်အပြင်အဆင် အစိမ်းနုရောင် |
| w3-theme-dark-grey.css | အရောင် အပြင်အဆင် Dark Grey |
| w3-theme-deep-orange.css | အရောင်အပြင်အဆင် နက်ရှိုင်းသောလိမ္မော်ရောင် |
| w3-theme-deep-purple.css | အရောင်အပြင်အဆင် နက်ရှိုင်းသော ခရမ်းရောင် |
| w3-theme-green.css | အရောင်အပြင်အဆင် အစိမ်းရောင် |
| w3-theme-grey.css | အရောင်အပြင်အဆင် မီးခိုးရောင် |
| w3-theme-indigo.css | အရောင်အပြင်အဆင် မဲနယ် |
| w3-theme-khaki.css | အရောင်အပြင်အဆင် ကာကီ |
| w3-theme-light-blue.css | အရောင်အပြင်အဆင် အပြာနုရောင် |
| w3-theme-light-green.css | အရောင်အပြင်အဆင် အစိမ်းဖျော့ |
| w3-theme-lime.css | အရောင် Theme Lime |
| w3-theme-orange.css | အရောင်အပြင်အဆင် လိမ္မော်ရောင် |
| w3-theme-pink.css | အရောင် Theme ပန်းရောင် |
| w3-theme-purple.css | အရောင်အပြင်အဆင် ခရမ်းရောင် |
| w3-theme-red.css | အရောင်အပြင်အဆင် အနီရောင် |
| w3-theme-teal.css | အရောင် အပြင်အဆင် စိမ်းပြာ |
| w3-theme-yellow.css | အရောင် အပြင်အဆင် အဝါ |