CSS ရှုထောင့် ပိုင်ဆိုင်မှု
ဥပမာ
3D အနေအထားဖြင့် ဒြပ်စင်ကို ရှုထောင့်အချို့ ပေးပါ။
#div1
{
perspective: 100px;
}
အောက်တွင် နောက်ထပ် "စမ်းသုံးကြည့်ပါ" ဥပမာများ။
အဓိပ္ပါယ်နှင့် အသုံးပြုမှု
ပိုင်ဆိုင်မှု ကို perspective
3D အနေအထားဖြင့် ဒြပ်စင်အမြင်အချို့ပေးရန်အတွက် အသုံးပြုသည်။
ပစ္စည်း perspective
သည် အသုံးပြုသူနှင့် မည်မျှအကွာအဝေးမှ အရာဝတ္ထုကို သတ်မှတ်သည်။ ထို့ကြောင့်၊ နိမ့်သောတန်ဖိုးသည် မြင့်မားသောတန်ဖိုးထက် ပိုမိုပြင်းထန်သော 3D အကျိုးသက်ရောက်မှုကို ဖြစ်ပေါ်စေလိမ့်မည်။
ဒြပ်စင်တစ်ခုအတွက် ပိုင်ဆိုင်မှုကို သတ်မှတ်သည့်အခါ perspective
၊ ၎င်းသည် ဒြပ်စင်ကိုယ်တိုင်မဟုတ်ဘဲ ရှုထောင့်အမြင်ကို ရရှိသည့် CHILD ဒြပ်စင်ဖြစ်သည်။
အကြံပြုချက်- အသုံးပြုသူသည် 3D အရာဝတ္ထုကို ကြည့်နေသည့် အနေအထားကို သတ်မှတ်ပေးသည့် ရှုထောင့်-မူရင်း ပိုင်ဆိုင်မှုကို ကြည့် ပါ ။
ရှုထောင့်ပိုင်ဆိုင်မှုကို ပိုနားလည်ရန်၊ သရုပ်ပြတစ်ခုကို ကြည့်ပါ ။
မူလတန်ဖိုး: | မရှိ |
---|---|
အမွေဆက်ခံသည်- | မဟုတ်ဘူး |
သက်ဝင်လှုပ်ရှားနိုင်သော | ဟုတ်တယ် ကာတွန်း အကြောင်းဖတ်ပါ။ |
ဗားရှင်း- | CSS3 |
JavaScript syntax- | အရာဝတ္ထု .style.perspective="50px" |
Browser ပံ့ပိုးမှု
ဇယားရှိ နံပါတ်များသည် ပိုင်ဆိုင်မှုကို အပြည့်အဝထောက်ခံသည့် ပထမဆုံးဘရောက်ဆာဗားရှင်းကို သတ်မှတ်ပေးသည်။
-webkit- သို့မဟုတ် -moz- ဖြင့်လိုက်သောနံပါတ်များကို ရှေ့ဆက်တွဲဖြင့်လုပ်ဆောင်သော ပထမဆုံးဗားရှင်းကို သတ်မှတ်ပါ။
Property | |||||
---|---|---|---|---|---|
perspective | 36.0 12.0 -webkit- |
10.0 | 16.0 10.0 -moz- |
9.0 4.0.3 -webkit- |
23.0 15.0 -webkit- |
CSS Syntax
perspective: length|none;
အိမ်ခြံမြေတန်ဖိုးများ
Property Value | Description |
---|---|
length | How far the element is placed from the view |
none | Default value. Same as 0. The perspective is not set |
initial | Sets this property to its default value. Read about initial |
inherit | Inherits this property from its parent element. Read about inherit |
နောက်ထပ် ဥပမာများ
ဥပမာ
cube တစ်ခုကို ဖန်တီးပြီး မတူညီသော အမြင်များကို သတ်မှတ်ပါ ။
.ex1 {
perspective: 800px;
}
.ex2 {
perspective: 150px;
}
ဆက်စပ်စာမျက်နှာများ
CSS သင်ခန်းစာ- CSS 3D အသွင်ပြောင်းမှုများ
HTML DOM ရည်ညွှန်းချက်- အမြင်ပိုင်ဆိုင်မှု