CSS3 ဖို့အဓိကအပြောင်းအလဲကိုနားလည်ခြင်း
CSS2 နှင့်အကြားအကြီးမားဆုံးကွာခြားချက် CSS3 CSS3 module တွေကိုခေါ်ကွဲပြားခြားနားသောကဏ္ဍများသို့တက်ခွဲထားပြီးဖြစ်ပါတယ်။ ဤအ module တွေတစ်ခုချင်းစီထောက်ခံချက်လုပ်ငန်းစဉ်၏အမျိုးမျိုးသောအဆင့်ဆင့်အတွက် W3C မှတဆင့်၎င်း၏လမ်းအောင်ဖြစ်ပါတယ်။ ဤဖြစ်စဉ်ကိုကွဲပြားခြားနားသောထုတ်လုပ်သူအားဖြင့် browser မှာလက်ခံအကောင်အထည်ဖော်ခံရဖို့ CSS3 အမျိုးမျိုးကိုအပိုင်းပိုင်းအဘို့အကအများကြီးပိုမိုလွယ်ကူစေတော်မူပြီ။
သငျသညျ CSS2 နှင့်အတူဖြစ်ပျက်မှဤဖြစ်စဉ်ကိုနှိုင်းယှဉ်ပါလျှင်အရာခပ်သိမ်းသူအပေါင်းတို့ကိုအတူတစ်ခုတည်းစာရွက်စာတမ်းအဖြစ်တင်သွင်းခဲ့ခြင်းဖြစ်သည်ရှိရာ, ကက်စကိတ်ပုံစံ Sheet များ ကအတွင်းသတင်းအချက်အလက်, သငျသညျသေးငယ်, တစ်ဦးချင်းစီကိုအပိုင်းပိုင်းသို့တက်ထောက်ခံချက်ကိုချိုးဖောက်၏အားသာချက်များကိုကြည့်ရှုရန်စတင်။ အဆိုပါ module တွေတစ်ခုချင်းစီတစ်ခုချင်းစီအပေါ်အလုပ်လုပ်ခဲ့လျက်ရှိသည်သောကြောင့်, ကျနော်တို့ CSS3 module တွေအဘို့အဘရောက်ဇာကိုထောက်ခံကြောင်းတစ်အများကြီးကျယ်ပြန့်အကွာအဝေးရှိသည်။
မဆိုအသစ်နှင့်သတ်မှတ်ချက်တွင်ပြောင်းလဲနေတဲ့နှင့်ဝသကဲ့သို့, သင်တတ်နိုင်သလောက်များများ browser များနှင့်လည်ပတ်မှုစနစ်များအတွက်နှိုက်နှိုက်ချွတ်ချွတ်သင့်ရဲ့ CSS3 စာမျက်နှာများတွင်စမ်းသပ်ဖို့သေချာပါစေ။ ပန်းတိုင်တိုင်းကို browser အတွက်အတိအကျတူညီကြည့်ရှုဝက်ဘ်စာမျက်နှာများကိုဖန်တီးရန်, ဒါပေမယ့် CSS3 စတိုင်များအပါအဝင်သင်အသုံးပြုမဆိုစတိုင်များ, သူတို့ကိုထောကျပံ့သော browser များအတွက်ကြီးမြတ်ကိုကြည့်သေချာသူတို့ကြောင့်အဟောင်းတွေ browser များအဘို့လျောက်ပတ်ပြန်ကျသည်မဟုတ်ကိုသတိရပါ မလုပ်ပါနှင့်။
နယူး CSS3 selector
CSS3 သငျသညျသစ်ကို CSS ကို selector တွေကိုအဖြစ်အသစ်တခုပေါင်းစပ်နှင့်အချို့သောသစ်ကို Pseudo-element တွေနှင့်အတူ CSS ကိုစည်းမျဉ်းစည်းကမ်းတွေကိုရေးနိုင်ပါတယ်နည်းလမ်းအသစ်များကိုတစည်းပေးထားပါတယ်။
အသစ်သုံးမျိုးတွေက attribute selector:
- attribute စတင်ပွဲအတိအကျဒြပ်စင် [foo ^ = "ဘား"] အဆိုပါဒြပ်စင် "ဘား" ဥပမာဖြင့်အစပြုတဲ့ attribute ကိုခေါ်တော်မူ foo ရှိပါတယ်
- ပွဲအဆုံးသတ်ရေး attribute အတိအကျဒြပ်စင် [foo $ = "ဘား"] အဆိုပါဒြပ်စင် "ဘား" ဥပမာအတူအဆုံးသတ်ထားတဲ့ attribute ကိုခေါ်တော်မူ foo ရှိပါတယ်
- attribute ပွဲဒြပ်စင် [foo * = "ဘား"] အဆိုပါ element က string ကို "ဘား" ဥပမာပါရှိသည်တစ်ခု attribute ကိုခေါ်တော်မူ foo ရှိပါတယ်ပါရှိသည်
16 သစ်ကို Pseudo-အတန်း:
- : အမြစ်
- စာရွက်စာတမ်းများ၏အမြစ်ဒြပ်စင်။ HTML မှာဒီအစဉ်အမြဲဖြစ်ပါတယ်။
- : nth ကလေး (ဎ)
- အတိအကျကလေးကဒြပ်စင်ကိုက်ညီသို့မဟုတ်မီးခြစ်ပြောင်းရ variable တွေကိုသုံးစွဲဖို့ဒီကိုသုံးပါ။
- : nth-နောက်ဆုံးကလေး (ဎ)
- ပြီးခဲ့သည့်တဦးတည်းအနေဖြင့်ဖွင့်ရေတွက်အတိအကျကလေးက element တွေကိုကိုက်ညီမှုမရှိပါ။
- : nth-of type ကို (ဎ)
- document tree ထဲမှာရှေ့မှာအမည်တူနှင့်အတူမှေးခငျြး element တွေကိုကိုက်ညီမှုမရှိပါ။
- : nth-နောက်ဆုံး-of type ကို (ဎ)
- အောက်ခြေကနေတက်ရေတွက်အမည်တူနှင့်အတူမှေးခငျြး element တွေကိုကိုက်ညီမှုမရှိပါ။
- : နောက်ဆုံးကလေး
- မိဘ၏နောက်ဆုံးကလေးကဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- : ပထမဦးဆုံး-of type ကို
- ကြောင်းအမျိုးအစားကိုပထမဦးဆုံးချင်းဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- : နောက်ဆုံး-of type ကို
- ကြောင်းအမျိုးအစား၏နောက်ဆုံးမှေးခငျြးဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- သာကလေး
- ၎င်း၏မိဘ၏တစ်ခုတည်းသောကလေးအသောဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- သာ-of type ကို
- ယင်း၏အမျိုးအစားများ၏တစ်ဦးတည်းသာပါသောဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- :ဗလာ
- (စာသားကို node များအပါအဝင်) သားသမီးမရှိတယ်သောဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- : ပစ်မှတ်
- ယင်းကိုရည်ညွှန်း URI ၏ပစ်မှတ်ကြောင်း Element တစ်ခုရဲ့ကိုက်ညီမှုမရှိပါ။
- : enabled
- က enabled ရဲ့အခါဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- : မသန်စွမ်း
- ဒါကြောင့်ကိုပိတ်ထားရမယ့်အခါဒြပ်စင်ကိုက်ညီမှုမရှိပါ။
- : check လုပ်ထား
- က check လုပ်ထားရဲ့အခါဒြပ်စင် (ရေဒီယိုခလုတ်ကိုသို့မဟုတ် checkbox ကို) ကိုက်ညီမှုမရှိပါ။
- မ (များ)
- ပွဲစဉ်ဟာ element ကရိုးရှင်းတဲ့မကိုက်ညီသည့်အခါ selector ့။
တဦးတည်းသစ်ကိုပေါင်းစပ်:
- elementA ~ elementB
- ပွဲစဉ် elementB elementA ပြီးနောက်တစ်နေရာရာအောက်ပါအတိုင်းအခါ, မဟုတ်သေချာပေါက်ချက်ချင်း။
နယူး Properties ကို
CSS3 လည်းအသစ်သော CSS ကိုဂုဏ်သတ္တိများ၏နံပါတ်မိတ်ဆက်ပေးသည်။ ဤအဂုဏ်သတ္တိများ၏အတော်များများကဖွယ်ရှိ Photoshop ကိုကဲ့သို့သောဂရပ်ဖစ် program နဲ့ပိုပြီးဆက်စပ်မယ်လို့အမြင်အာရုံစတိုင်များကိုဖန်တီးရန်ရှိကြ၏။ ဤအရာအချို့ကိုနယ်စပ်-အချင်းဝက်သို့မဟုတ်သေတ္တာ-အရိပ်ကဲ့သို့ CSS3 လျှင်မိတ်ဆက်စကားဝန်းကျင်ကတည်းကပါပြီ။ flexbox သို့မဟုတ်ပင် CSS ကို Grid များကဲ့သို့အခြားသူများကို, ဆဲမကြာခဏထည့်သွင်းစဉ်းစား CSS3 ဖြည့်စွက်ဖြစ်ကြောင်းအသစ်များစတိုင်များဖြစ်ကြသည်။
CSS3 မှာသေတ္တာမော်ဒယ်ပြောင်းလဲသွားမထားပါဘူး။ သို့သော်သင်သည်သင်၏သေတ္တာများ၏နောက်ခံနှင့်နယ်နိမိတ် style ကိုကူညီနိုင်ကြောင်းသစ်ကိုစတိုင်ဂုဏ်သတ္တိများတစည်းရှိပါတယ်။
အကွိမျမြားစှာနောက်ခံငါမာဂုပညာရှိ
သင် box ထဲမှာတယောက်ကိုတယောက်ထိပ်ပေါ်မှာ layered ခံရဖို့မျိုးစုံနောက်ခံပုံရိပ်တွေကိုသတ်မှတ်နိုင်ပါတယ် background-image ကို, နောက်ခံ-အနေအထားနှင့်နောက်ခံ-ထပ်စတိုင်များအသုံးပြုခြင်း။ ပထမဦးဆုံးပုံရိပ်နောက်ကွယ်မှခြယ်အောက်ပါသူတွေနဲ့အတူအသုံးပြုသူအနီးဆုံးအလွှာဖြစ်ပါတယ်။ တစ်ဦးနောက်ခံအရောင်လည်းမရှိဆိုပါကအားလုံး image ကိုအလွှာအောက်တွင်ဖော်ပြထားသောခြယ်သထားသည်။
နယူးနောက်ခံပုံစံ Properties ကို
CSS3 အချို့သစ်ကိုနောက်ခံဂုဏ်သတ္တိများလည်းရှိပါတယ်။
- နောက်ခံ-ကလစ်
- ဤသည်ပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုနောက်ခံပုံရိပ်ကျန်သေးသည်ရပါမည်ကိုမည်သို့သတ်မှတ်ပါတယ်။ အဆိုပါ default အနေနဲ့နယ်စပ်ကိုသေတ္တာဖြစ်တယ်, ဒါပေမဲ့ဒါဟာ padding ကိုသေတ္တာသို့မဟုတ်အကြောင်းအရာ box ကိုပြဖို့အတွက်ပြောင်းလဲနိုင်ပါတယ်။
- နောက်ခံ-ဇာစ်မြစ်
- ဤသည်ပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုနောက်ခံအဆိုပါ padding ကို box ကိုနယ်စပ် box ကို, ဒါမှမဟုတ်အကြောင်းအရာ box ထဲမှာသောအရပ်တို့ကိုမဖြစ်သင့်ရှိမရှိဆုံးဖြတ်သည်။
- နောက်ခံ-size ကို
- ဤသည်ပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုကိုသင်နောက်ခံပုံ၏အရွယ်အစားညွှန်ပြခွင့်ပြုပါတယ်။ ဒါဟာသင်စာမျက်နှာ fit မှသေးငယ်ပုံရိပ်တွေဆန့်ခွင့်ပြုပါတယ်။
ဖြစ်တည်မှုနောက်ခံပုံစံ Properties ကိုမှအပြောင်းအလဲများ
လက်ရှိနောက်ခံစတိုင်ဂုဏ်သတ္တိများအနည်းငယ်အပြောင်းအလဲများကိုလည်းရှိပါတယ်:
- နောက်ခံ-ထပ်
- အာကာသနှင့်ပတ်ပတ်လည်: ဤပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုများအတွက်သစ်နှစ်မျိုးကိုတန်ဖိုးများရှိပါတယ်။ အာကာသကွက်လပ်အတွက် tile image ကိုအညီအမျှကျန်သေးသည်ခံခြင်းမရှိဘဲ box ကိုအတွင်း။ round က tile က box ထဲမှာအကြိမ်တစ်ခုလုံးအရေအတွက်ကိုလိမ့်မည်သို့မှသာနောက်ခံပုံရိပ် rescales ။
- နောက်ခံ-attachment ကို
- ကြောင်းဒြပ်စင်သည်စာလိပ်ဘားရှိပါတယ်အခါနောက်ခံ Element ရဲ့ content တွေနဲ့ scroll ပါလိမ့်မယ်ဒါကြောင့် "ဒေသခံက" တန်ဖိုးအသစ်ထည့်သွင်းထားပါသည်။
- နောက်ခံ
- နောက်ခံအတိုကောက် property ကိုအရွယ်အစားနှင့်မူရင်းဂုဏ်သတ္တိအတွက်ထပ်ပြောသည်။
CSS3 နယ်စပ်ရေးရာ Properties ကို
CSS3 နယ်စပ်မှာတော့ကျနော်တို့ (စသည်တို့ကို, Dash နှစ်ချက်, အစိုင်အခဲ) ရန်အသုံးပြုနေစတိုင်များနိုင်ပါတယ်ဒါမှမဟုတ်သူတို့ပုံတစ်ပုံရှိနိုင်ပါသည်။ Plus အား, CSS3 rounded corner နဲ့ဖန်တီးနိုင်စွမ်းအတွက်တတ်၏။ သင်တို့ရှိသမျှလေးနယ်နိမိတ်၏ပုံရိပ်တစ်ခုဖန်တီးပြီးတော့သင့်ရဲ့နယ်နိမိတ်ကို image ကိုလျှောက်ထားရန်မည်သို့ CSS ကိုပြောပြဘာဖြစ်လို့လဲဆိုတော့နယ်စပ်ရေးရာပုံရိပ်တွေစိတ်ဝင်စားစရာကောင်းဖြစ်ကြသည်။
နယူးနယ်စပ်ရေးရာစတိုင် Properties ကို
CSS3 အချို့သစ်ကိုနယ်စပ်ဂုဏ်သတ္တိများရှိပါတယ်:
- နယ်စပ်-အချင်းဝက်
- နယ်စပ်-top-Right-အချင်းဝက်, နယ်စပ်-Bottom-Right-အချင်းဝက်, နယ်စပ်-Bottom-လက်ဝဲ-အချင်းဝက်, နယ်စပ်-top-left-အချင်းဝက်
- ဤရွေ့ကားဂုဏ်သတ္တိများသင်သည်သင်၏နယ်နိမိတ်အပေါ် rounded corner နဲ့ကိုဖန်တီးရန်ခွင့်ပြုသည်။
- နယ်စပ်-image ကို-Source
- အစားပြီးသားသတ်မှတ်ထားသောနယ်စပ်စတိုင်များ၏အသုံးပြုနိုင်ဖို့အတွက်ပုံရိပ်အရင်းအမြစ်ဖိုင်ဖေါ်ပြသည်။
- နယ်စပ်-image ကို-အချပ်
- နယ်စပ် image ကိုအနားကနေအတွင်းကိုထေမိကိုယ်စားပြုတယ်
- နယ်စပ်-image ကို-width ကို
- သင်တို့နယ်အပိုင်းအခြားပုံရိပ်ကိုများအတွက်အကျယ်၏တန်ဖိုးအဖြစ်သတ်မှတ်ပါတယ်။
- နယ်စပ်-image ကို-အစကတည်းက
- နယ်စပ်ပုံရိပ်ဧရိယာနယ်စပ် box ကိုကျော်လွန်ချဲ့ထွင်သောငွေပမာဏကိုသတ်မှတ်ရန်။
- နယ်စပ်-image ကို-လမ်းပိုင်း
- နယ်စပ်ပုံရိပ်များ၏နှစ်ဖက်နှင့်အလယ်တန်းအစိတ်အပိုင်းများ tiled သို့မဟုတ်ခဲ့သည်ဆို၏ရပါမည်ကိုမည်သို့သတ်မှတ်ပါတယ်။
- နယ်စပ်-image ကို
- လူအပေါင်းတို့သည်နယ်စပ်ပုံရိပ်ကိုဂုဏ်သတ္တိများများအတွက်အတိုကောက် property က။
နယ်ခြားမဲ့နှင့်နောက်ခံမှ Related အပိုဆောင်း CSS3 Properties ကို
တစ်သေတ္တာစာမျက်နှာချိုး, (inline element တွေအတွက်) line break များအတွက်ကော်လံချိုးမှာကျိုးသည်အခါသေတ္တာ-အလှဆင်-ချိုးပိုင်ဆိုင်မှုသစ်ကိုသေတ္တာများနယ်စပ်နှင့် padding ကိုနှင့်အတူပတ်ရစ်လျက်ရှိသည်ကိုဘယ်လိုသတ်မှတ်ပါတယ်။ နောက်ခံကဒီပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုကို အသုံးပြု. မျိုးစုံကျိုးသေတ္တာများအကြားထခွဲခြားနိုင်ပါသည်။
ထို့အပြင် element တွေကိုသေတ္တာမှအရိပ်ကိုထည့်သွင်းအသုံးပြုနိုင်မယ့် box ကို-အရိပ်ပိုင်ဆိုင်မှုရှိပါသည်။
CSS3 နှင့်အတူ, သငျသညျယခုအလွယ်တကူစားပွဲဒါမှမဟုတ်ရှုပ်ထွေး div tag ကိုအဆောက်အဦများမပါဘဲမျိုးစုံကော်လံနဲ့ web page ကိုဖွင့်လှစ်နိုင်ပါ။ သငျသညျရိုးရှင်းစွာခန္ဓာကိုယ်ဒြပ်စင်ရှိသင့်မည်မျှကော်လံများနှင့်သူတို့ကဖြစ်သင့်သည်မည်မျှကျယ်ပြန့် browser ကိုပြောပြပါ။ Plus အားသင်, ကော်လံ၏အမြင့် span ကြောင်းနောက်ခံအရောင်တွေနယ်နိမိတ် (စည်းမျဉ်းစည်းကမ်း) ကိုထည့်သွင်းနိုင်ပြီး, သင်၏စာသားအလိုအလျှောက်အပေါငျးတို့သကော်လံမှတဆင့်စီးဆင်းမည်ဖြစ်သည်။
CSS3 ကော်လံများ - ကော်လံ၏နံပါတ်နှင့်အကျယ် Define
အသစ်သုံးမျိုးရှိပါတယ် ဂုဏ်သတ္တိများ သင်သည်သင်၏ကော်လံ၏နံပါတ်နှင့်အကျယ်သတ်မှတ်ခွင့်ပြုကြောင်း:
- ကော်လံ-width ကို
- သင့်ရဲ့ကော်လံဖြစ်သင့်ရဲ့ width သတ်မှတ်ပါတယ်။ အဆိုပါ browser ကိုထိုကျယ်ပြန့်ကော်လံနှင့်အတူအာကာသဖြည့်ဖို့စာသားစီးဆင်းလိမ့်မယ်။
- ကော်လံ-count က
- စာမကျြနှာပျေါမှာကော်လံ၏နံပါတ်သတ်မှတ်ပါတယ်။ အဆိုပါ browser ကိုပြီးတော့ကျယ်ပြန့်အလုံအလောက်အာကာသအတွင်း fit မှကော်လံဖန်တီးပါလိမ့်မယ်, ဒါပေမယ့်ကိုသာအရေအတွက်ကသငျသညျကိုသတ်မှတ်။
- ကော်လံ
- သင်အကျယ်သို့မဟုတ်နံပါတ်တစ်ခုခုကိုသတ်မှတ်နိုင်ပါတယ် (သို့မဟုတ်နှစ်ဦးစလုံး, ဒါပေမယ့်မရှိသလောက်သဘာဝကျပါတယ်) ရှိရာအတိုကောက် property က။
CSS3 ကော်လံကွာဟချက်နှင့်စည်းကမ်းများ
ကွာဟချက်များနှင့်စည်းမျဉ်းစည်းကမ်းတွေကိုအတူတူ multicolumn ဇာတ်လမ်းထဲမှာကော်လံအကြားချထားပါသည်။ ကွာဟချက်ဟာကော်လံမပါဘဲတွန်းပါလိမ့်မယ်, ဒါပေမယ့်စည်းမျဉ်းစည်းကမ်းတွေကိုမဆိုအာကာသကိုတက်ယူကြပါဘူး။ တစ်ကော်လံအုပ်ချုပ်မှုကိုကြောင့်ကွာဟမှုရဲ့ထက်ပိုမိုကျယ်ပြန်ဖြစ်ပါတယ်ဆိုပါကကပ်လျက်ကော်လံထပ်ပါလိမ့်မယ်။ ကော်လံစည်းမျဉ်းစည်းကမ်းတွေနဲ့ကွာဟချက်ငါးအသစ်သောဂုဏ်သတ္တိများရှိပါတယ်:
- ကော်လံ-ကွာဟမှု
- အဆိုပါစစ်ကြောင်းများအကြားကွာဟချက်ရဲ့ width သတ်မှတ်ပါတယ်။
- ကော်လံ-အုပ်ချုပ်မှုကို-အရောင်
- စိုးမိုးရေး၏အရောင်အဖြစ်သတ်မှတ်ပါတယ်။
- ကော်လံ-အုပ်ချုပ်မှုကို-စတိုင်
- စိုးမိုးရေး (အစိုင်အခဲ, တွေက dotted နှစ်ချက်, etc) ၏စတိုင်လ်သတ်မှတ်ပါတယ်။
- ကော်လံ-အုပ်ချုပ်မှုကို-width ကို
- စိုးမိုးရေးရဲ့ width သတ်မှတ်ပါတယ်။
- ကော်လံ-အုပ်ချုပ်မှုကို
- တခါမှာအားလုံးသုံးကော်လံအုပ်ချုပ်မှုကိုဂုဏ်သတ္တိများ defining တစ်ဦးကအတိုကောက် property က။
CSS3 ကော်လံကော်လံများ spanning Break များ, နှင့်ဖြကော်လံများ
ကော်လံလပ်ချိန် ပေမယ့်အသစ်သုံးမျိုးဂုဏ်သတ္တိများနှင့်အတူ, စာမျက်နှာအကြောင်းအရာအတွက်အားလပ်ချိန်သတ်မှတ်ဖို့အသုံးပြုအတူတူ CSS2 options တွေကိုအသုံးပြုနိုင်: မတိုင်မီ-ကိုချိုးဖျက် Break-ပြီးမှ, Break-အတွင်းပိုင်း။
စားပွဲနှင့်အတူလိုပဲ, သင်ကော်လံ-span ပိုင်ဆိုင်မှုနှင့်အတူကော်လံ span မှဒြပ်စင်သတ်မှတ်နိုင်သည်။ ဒါဟာသင်ပိုမိုသတင်းစာများကဲ့သို့အများအပြားကော်လံ span ကြောင်းခေါင်းကြီးပိုင်းတွင်ဖန်တီးခွင့်ပြုထားသည်။
ကော်လံကိုဖြည့်အကြောင်းအရာတစ်ခုချင်းစီကိုကော်လံ၌ဖြစ်လိမ့်မည်ဘယ်လောက်ဆုံးဖြတ်ခဲ့ကြသည်။ ဟန်ချက်ညီကော်လံကော်လံအပြည့်အဝဖြစ်ပါတယ်, ပြီးတော့လာမယ့်တဦးတည်းသွားသည်အထိအော်တိုရုံအကြောင်းအရာထဲမှာစီးဆင်းနေချိန်တွင်အသီးအသီးကော်လံထဲမှာအကြောင်းအရာ၏တူညီသောငွေပမာဏကိုထားနိုင်အောင်ကြိုးစားပါ။
CSS2 အတွက်ပါဝငျ T; Aren & # 39 ဆိုလိုသည်မှာ CSS3 ပိုမိုအင်္ဂါရပ်များ
အပါအဝင် CSS2 အတွက်မတည်ရှိခဲ့ CSS3 အတွက်အပိုဆောင်း features တွေအများကြီးရှိပါတယ်:
- CSS ကို Template: layout ကို module တစ်ခုနှင့် CSS3 Grid positioning ကို module: CSS နဲ့ Grid Creating ။
- CSS3 စာသား module: စာသားကိုဖျောပွပါနှင့်ပင် CSS နဲ့ Drop-မှောင်မိုက်အရိပ်ဖန်တီးပါ။
- CSS3 အရောင် module: အခု opacity ကိုအတူ။
- box ကိုမော်ဒယ်မှအပြောင်းအလဲများ: တစ်အပါအဝင် marquee က IE tag ကိုနဲ့တူပြုမူကြောင်းအိမ်ခြံမြေ။
- CSS3 User Interface module: သင်သစ်ကို cursor, လုပ်ရပ်များမှတုံ့ပြန်မှု, လိုအပ်သောလယ်ကွင်းများနှင့်ပင်ပေးခြင်း အရွယ်အစားကိုချုံ့နေဆဲဒြပ်စင် ။
- media query: ကတော့ style sheet ကိုအသုံးပြုရပါမည်ကိုမည်သို့ defining တဲ့အခါမှာမီဒီယာမေးမြန်းချက်သင်ပိုမိုပြောင်းလွယ်ပြင်လွယ်ခွင့်ပြုပါ။ ဥပမာအားဖြင့်, သင်သာ 20em ထက်ပိုကြီးတဲ့တစ် viewport ရှိသည်သောလက်ကိုင် device များအတွက်ကြောင်းကတော့ style sheet သတ်မှတ်နိုင်ဘူး။
- CSS3 ပတ္တမြား module: စာရွက်စာတမ်းများမှတ်စာရေးသွင်းဖို့စာသားပတ္တမြားအသုံးပြုဘာသာစကားများထောက်ခံမှုပေး။
- CSS3 စာမျက်နှာမီဒီယာ module: မျက်နှာမီဒီယာ (စက္ကူ, Transparency, etc) အတွက် ပို. ပင်ထောက်ခံမှုသည်။
- generated content ကို: L ကိုအပြေး ခေါင်းစီးများ နှင့် Footer, အောက်ခြေနှင့်အထူးသဖြင့်စာမျက်နှာမီဒီယာများအတွက်, အစီအစဉ်တထုတ်လုပ်ပြီးကြောင်းအခြားအကြောင်းအရာများကို။
- CSS3 ခွန်း module: က aural CSS ကိုမှအပြောင်းအလဲများ။