လုပ်နည်း - စာမျက်နှာအပြည့်ပုံ
CSS ဖြင့် စာမျက်နှာအပြည့် နောက်ခံပုံ ဖန်တီးနည်းကို လေ့လာပါ။
စာမျက်နှာအပြည့်ပုံ
ဘရောင်ဇာဝင်းဒိုးတစ်ခုလုံးကို လွှမ်းခြုံထားသည့် နောက်ခံပုံတစ်ခု ဖန်တီးနည်းကို လေ့လာပါ။ အောက်ဖော်ပြပါ ဥပမာသည် မျက်နှာပြင်အပြည့် (နှင့် မျက်နှာပြင်တစ်ဝက်) တုံ့ပြန်မှုရှိသော နောက်ခံပုံကို ပြသသည်-
သရုပ်ပြ - စာမျက်နှာအပြည့် နောက်ခံပုံ
သရုပ်ပြ - စာမျက်နှာတစ်ဝက် နောက်ခံပုံ
Full Height Image ဖန်တီးနည်း
ကွန်တိန်နာဒြပ်စင်ကို အသုံးပြုပြီး ကွန်တိန်နာတွင် နောက်ခံပုံတစ်ပုံကို ထည့်ပါ height: 100%
။
အကြံပြုချက်- စာမျက်နှာတစ်ဝက် နောက်ခံပုံ ဖန်တီးရန် 50% ကို အသုံးပြုပါ။ ထို့နောက် ရုပ်ပုံအား အလယ်ဗဟိုနှင့် ချိန်ညှိရန် အောက်ပါ နောက်ခံဂုဏ်သတ္တိများကို အသုံးပြုပါ။
မှတ်ချက်- ရုပ်ပုံသည် စခရင်တစ်ခုလုံးကို ဖုံးအုပ်ထားကြောင်း သေချာစေရန်၊ သင်သည် height: 100%
<html> နှင့် <body> နှစ်ခုလုံး အတွက်လည်း သက်ဆိုင်ရပါမည်။
ဥပမာ
body, html {
height: 100%;
}
.bg {
/* The image used */
background-image: url("img_girl.jpg");
/* Full height */
height: 100%;
/* Center and scale the image nicely */
background-position: center;
background-repeat:
no-repeat;
background-size: cover;
}
စာမျက်နှာတစ်ဝက် နောက်ခံပုံ-
ဥပမာ
.bg {
height: 50%;
}