စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

အသုံးပြုခြင်း နှင့် အသုံးပြုခြင်း

mask-size အချက်အလက် ကို သုံးစွဲပါ

အမှတ်

အမှတ် 1

လှည့်ပတ် အချက်အလက် ကို ပုံစံ ဖြင့် သုံးစွဲပါ (ပုံစံ အားဖြင့်):

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 70%;
  mask-repeat: no-repeat;
}

ကိုယ်တိုင် ကြိုးစား ကြည့်ပါ

အမှတ် 2

လှည့်ပတ် အချက်အလက် ကို ပုံစံ ဖြင့် သုံးစွဲပါ (ပမာဏ အားဖြင့်):

.mask1 {
  -webkit-mask-image: url(w3logo.png);
  mask-image: url(w3logo.png);
  mask-size: 200px 200px;
  mask-repeat: no-repeat;
}

ကိုယ်တိုင် ကြိုးစား ကြည့်ပါ

CSS ဘာသာစကား

mask-size: auto|size|contain|cover|initial|inherit;

အချက်အလက်

ဘာသာစကား ဖော်ပြ
auto မူကွဲစိတ်ကြား
size လှည့်ပတ် အချက်အလက် ကို ဖြန့်ကာ ပုံစံ ကို သုံးစွဲပါ。
contain လှည့်ပတ် အချက်အလက် ကို ဖြန့်ကာ အကွက် ကြီး နှင့် အကွက် သိန်း ကို အတူ ဖြန့်ကာ စေသည်。
cover လှည့်ပတ် အချက်အလက် ကို ဖြန့်ကာ အကွက် ကြီး နှင့် အကွက် သိန်း ကို ချုပ်ဆိုင် စေသည်。
initial အခြေခံ ကို သုံးစွဲပါ。 initial
inherit အဖွဲ့အစည်း ကို တိုက်ရိုက် အခြေခံ သုံးစွဲပါ。 inherit

နည်းပါးစွာ

မူကွဲစိတ်ကြား: auto
တိုက်ရိုက်ထိတွေ့ နည်း
လှည့်ပတ် ဖန်တီး: ကူညီဘဲလှည့်ပတ် ထိပ်တန်း အချက်အလက်
ပုံစံ: CSS Masking Module Level 1
JavaScript ဘာသာစကား: object.style.maskSize="100px 200px"

ဘာသာစကား ကူညီ

အခြေအနေအတိုင်း အကွက်တစ်ခု အပေါ် ထားသော စက္ခုတစ်ခု ကို ပြောင်းလဲစေသော ဘာသာစကား သည် မူကွဲစိတ်ကြား အောင် တင်နေသည်。

ခရိုးမိ အန်ဂျီ ဖက်ပေါ့ ဆာဖာ အိုပ်ရာ
120 120 53 15.4 106

相关页面

教程:CSS 遮罩

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ

参考:စတုရန်း မျက်နှာပြင် လက်ဆုပ် ချင်း ပြင်ထန်း အခြေအနေ