CSS ကိုအတူ technique ကို execute
သင်တစ်ဦးက်ဘ်ဆိုက်ဒီဇိုင်းနေလျှင်သင်ဝဘ်စာမျက်နှာပေါ်တွင်တစ်ဦး fixed နောက်ခံပုံသို့မဟုတ်ရေစာကိုဖန်တီးရန်မည်သို့မည်ပုံသင်ယူစိတ်ဝင်စားဖြစ်လိမ့်မယ်။ ဒါဟာအတော်လေးအချိန်အတန်ကြာအွန်လိုင်းလူကြိုက်များခဲ့တဲ့ဘုံဒီဇိုင်းကုသမှုဖြစ်ပါတယ်။ ဒါဟာလှည့်ကွက်များ၏သင်၏ဝဘ်ဒီဇိုင်းလေးအိတ်၌ရှိသည်ဖို့တစ်နေရာလေးကိုအကျိုးသက်ရောက်မှုဖြစ်ပါတယ်။
သငျသညျရှေ့တျော၌ဤအမှုကိုပြုသောကြပြီမဟုတ်သို့မဟုတ်ကံကောင်းပါစေမရှိဘဲယခင်ကကကြိုးစားခဲ့ကြလျှင်, လုပ်ငန်းစဉ်စိုးရွံ့ထင်ပေမယ့်မှာအားလုံးဟာတကယ်တော့အလွန်ခက်ခဲမဟုတ်ပါဘူး။ ဒီအကျဉ်းသင်ခန်းစာနှင့်အတူ, သင် CSS ကိုသုံးပြီးမိနစ်တစ်ဦးအမှု၌ယင်း technique ကိုကျွမ်းကျင်ဖို့လိုအပ်ပါတယ်သတင်းအချက်အလက်များအရပါလိမ့်မယ်။
စတင်ခဲ့သည်
(တကယ်မယ့်အလွန်အလင်းနောက်ခံပုံရိပ်တွေနေသော) နောက်ခံပုံရိပ်တွေသို့မဟုတ်ရေစာပုံနှိပ်ဒီဇိုင်းအတွက်သမိုင်းရှိသည်။ စာရွက်စာတမ်းများရှည်လျားကူးယူခံရခြင်းမှသူတို့ကိုကာကွယ်တားဆီးဖို့သူတို့အပျေါမှာရေစာထည့်သွင်းခဲ့ကြသည်။ ထို့အပြင်အများအပြား Flyer နှင့်ဘရိုရှာသည့်ပုံနှိပ်အပိုင်းအစများအတွက်ဒီဇိုင်း၏တစ်စိတ်တစ်ပိုင်းအဖြစ်အကြီးစားနောက်ခံပုံရိပ်တွေကိုအသုံးပြုပါ။ web design ရှည်လျားပုံနှိပ်ခြင်းနှင့်နောက်ခံပုံရိပ်တွေကနေစတိုင်များသည်ဤချေးစတိုင်များ၏တဝတည်းဖြစ်ကြ၏ချေးခဲ့သည်။
ဤရွေ့ကားကြီးမားနောက်ခံပုံရိပ်တွေကိုအောက်ပါသုံးခုကို အသုံးပြု. ဖန်တီးရန်လွယ်ကူများမှာ CSS ကိုစတိုင် ဂုဏ်သတ္တိများ:
- နောက်ခံ-image ကို
- နောက်ခံ-ထပ်
- နောက်ခံ-attachment ကို
- နောက်ခံ-size ကို
background-Image ကို
သင်သည်သင်၏ရေစာအဖြစ်အသုံးပြုမည်ဖြစ်ကြောင်း image ကိုသတ်မှတ်နိုင်ဖို့နောက်ခံ-image ကိုသုံးပါလိမ့်မယ်။ ဒါကစတိုင်ရိုးရိုးအမည်ရှိ directory ထဲတွင်ဖွယ်ရှိ, သင်သည်သင်၏ site ပေါ်တွင်ရှိသည်သောပုံရိပ်တစ်ခု load တစ်ဖိုင်လမ်းကြောင်းများကိုအသုံးပြု 'ပုံရိပ်တွေ။ "
နောက်ခံ-image: url (/images/page-background.jpg);
ဒါဟာ image ကိုသူ့ဟာသူပုံမှန်ပုံရိပ်ထက်ပိုမိုပေါ့ပါးသို့မဟုတ်ထိုထက်ပိုပွင့်လင်းကြောင်းအရေးကြီးပါတယ်။ ဤ "ရေစာ" တဲ့ Semi-ပွင့်လင်းပုံစာသား, ဂရပ်ဖစ်နှင့်, ဝဘ်စာမျက်နှာ၏အခြားအဓိကဒြပ်စင်နောက်ကွယ်ကတည်ရှိသည်ရသောကြည့်ရှုကြောင်းဖန်တီးပါလိမ့်မယ်။ ဒီခြေလှမ်းမရှိရင်နောက်ခံပုံရိပ်သင့်စာမျက်နှာပေါ်မှသတင်းအချက်အလက်များနှင့်အတူယှဉ်ပြိုင်ခြင်းနှင့်ဖတ်ရှုဖို့ကခက်ခဲပါလိမ့်မည်။
သငျသညျထိုကဲ့သို့သောကို Adobe Photoshop ကိုအဖြစ်မဆိုတည်းဖြတ်ရေးအစီအစဉ်တွင်နောက်ခံပုံရိပ်ညှိနိုင်ပါတယ်။
background-ထပ်ခါတလဲလဲ
background-repeat property ကိုလာမယ့်လာပါတယ်။ သင်သည်သင်၏ပုံရိပ်ကြီးမားတဲ့ရေစာ-စတိုင်ဂရပ်ဖစ်ဖြစ်လိုလျှင်သင်သာတစ်ချိန်ကကြောင်းပုံရိပ် display တွေလုပ်ဖို့ဒီ property ကိုသုံးလိမ့်မယ်။
နောက်ခံ-ထပ်: မထပ်;
"no-repeat" property ကမရှိရင်ကို default image ကိုစာမကျြနှာပျေါမှာထပ်ခါထပ်ခါပြန်လုပ်ပါလိမ့်မယ်ဆိုတာပါပဲ။ ဤသည်အများဆုံးခေတ်သစ်ဝဘ်စာမျက်နှာဒီဇိုင်းများအတွက်မလိုလားအပ်သောဖြစ်ပါတယ်, ဒါကြောင့်ဒီစတိုင်ကသင်၏ CSS ကိုအတွက်မရှိမဖြစ်ထည့်သွင်းစဉ်းစားရပါမည်။
background-နှောင်ကြိုး
background-attachment ကိုအများအပြားရှိသော web designer အကြောင်းကိုမေ့လျော့သောအိမ်ခြံမြေဖြစ်ပါတယ်။ ဒါဟာအသုံးပြုခြင်းသင် "ပုံသေ" property ကအသုံးပြုတဲ့အခါသင့်ရဲ့နောက်ခံပုံရိပ်အရပျ၌ fixed စောင့်ရှောက်။ ဒါဟာစာမျက်နှာပေါ်တွင် fixed ကြောင်းရေစာတစ်ခုသို့ကြောင့် image ကိုလှည့်အရာဖြစ်တယ်။
ဒီပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုများအတွက် default value ကို "စာစောင်ကို။ " ဖြစ်ပါတယ် သင်တစ်ဦး background-attachment ကိုတနျဖိုးကိုသတ်မှတ်မထားဘူးဆိုရင်, နောက်ခံစာမျက်နှာ၏ကျန်နှင့်အတူ scroll ပါလိမ့်မယ်။
နောက်ခံ-attachment ကို: fixed;
background-Size ကို
background-size ကိုတစ်ဦးအသစ်များ CSS ကိုပိုင်ဆိုင်မှုဖြစ်ပါတယ်။ ဒါဟာသင်ကြည့်ရှုခံသည် viewport အပေါ်အခြေခံပြီးတစ်ဦးနောက်ခံ၏အရွယ်အစားကိုသတ်မှတ်ခွင့်ပြုပါတယ်။ ဒီအဘို့အလွန်အသုံးဝင်သည် တုံ့ပြန်မှုဝက်ဘ်ဆိုက်များ ကွဲပြားခြားနားသောအရွယ်အစားမှာပြသလိမ့်မည်ဟု ကွဲပြားခြားနားသောကိရိယာများပေါ်တွင် ။
နောက်ခံ-size: အဖုံး;
သင်ဤပစ္စည်းဥစ္စာပိုင်ဆိုင်မှုများအတွက်သုံးနိုငျနှစျခုထောကျအကူပွုတန်ဖိုးများများပါဝင်သည်:
- အဖုံး - အပြည့်အဝအကျယ်သို့မဟုတ်အပြည့်အဝအမြင့်ဖြစ်စေပြသနိုင်အောင်နောက်ခံ Scales ။ ဒါကပုံရိပ်အချို့အစိတ်အပိုင်းများကို screen ပေါ်မှာပေါ်လာပေမယ်တစ်ခုလုံးကိုဧရိယာဖုံးလွှမ်းလိမ့်မည်မစေခြင်းငှါဆိုလိုသည်။
- ဆံ့ - တစ်ခုလုံးကို width နဲ့ height နှစ်ဦးစလုံး style အမျိုးမျိုးခံရသည့်ဧရိယာ၌ပြသလျက်ရှိသည်ဒါပုံရိပ်ကို Scales ။ အဆိုပါပုံရိပ်မပယ်မဖြတ်ဖြစ်ပါသည်, သို့သော်ကျဘက်ကိုအဆိုပါဧရိယာ၏အစိတ်အပိုင်းများပုံရိပ်ကိုဖြင့်ဖုံးလွှမ်းမရစေခြင်းငှါဖြစ်ပါသည်။
သင့်စာမျက်နှာဖို့ CSS ကိုထည့်သွင်းခြင်း
သငျသညျအထကျပါဂုဏ်သတ္တိများနှင့်၎င်းတို့၏တန်ဖိုးများကိုနားလည်သဘောပေါက်ပြီးနောက်, သင်သည်သင်၏ကွန်ရက်စာမျက်နှာကဤစတိုင်များထည့်သွင်းနိုင်ပါတယ်။
သင်တစ်ဦး Single-စာမျက်နှာ site ကိုလုပ်နေပါတယ်လျှင်သင်၏ဝဘ်စာမျက်နှာ၏ HEAD မှအောက်ပါအချက်များကိုထည့်ပါ။ သငျသညျ multi-စာမျက်နှာ site ကိုတည်ဆောက်ခြင်းနှင့်ပြင်ပစာရွက်၏တန်ခိုး၏အားသာချက်ယူချင်လျှင်အနေနဲ့ external style sheet များ CSS ကိုစတိုင်များကြောင့်ထည့်ပါ။