စက်တင်ပိုင်း နယ်ပြား box-shadow အချက်အလက်

定义和用法

box-shadow 属性向框添加一个或多个阴影。

提示：请使用 border-image-* 属性来构造漂亮的可伸缩按钮！

另请参阅：

CSS3 教程：CSS3 အဖက်အကျ

HTML DOM 参考手册：boxShadow 属性

实例

向 div 元素添加 box-shadow：

div
{
box-shadow: 10px 10px 5px #888888;
}

亲自试一试

页面底部有更多实例。

CSS 语法

box-shadow: h-shadow v-shadow blur spread color inset;

注释：box-shadow 向框添加一个或多个阴影。该属性是由逗号分隔的阴影列表，每个阴影由 2-4 个长度值、可选的颜色值以及可选的 inset 关键词来规定。省略长度的值是 0。

အခြေခံ အဆိုပါ

အဆိုပါ အခြေခံ ဖော်ပြ စစ်ဆေးခြင်း
h-shadow ဖြစ်ပေါ်သော အခြေခံ ကို တိုက်ရိုက် လက်ခံကြသည်。 စစ်ဆေးခြင်း
v-shadow ဖြစ်ပေါ်သော အခြေခံ ကို တိုက်ရိုက် လက်ခံကြသည်。 စစ်ဆေးခြင်း
blur အဆိုပါ အခြေခံ ကို အပြင်ဘက် သို့ ပြောင်းလဲခြင်း ကို အခက်အခဲ ကြသည်。 စစ်ဆေးခြင်း
spread အဆိုပါ အခြေခံ ကို အပြင်ဘက် သို့ ပြောင်းလဲခြင်း ကို အခက်အခဲ ကြသည်。 စစ်ဆေးခြင်း
color အဆိုပါ အခြေခံ ကို အပြင်ဘက် သို့ ပြောင်းလဲခြင်း ကို အခက်အခဲ ကြသည်。 စစ်ဆေးခြင်း
inset အဆိုပါ အခြေခံ ကို အပြင်ဘက် သို့ ပြောင်းလဲခြင်း ကို အခက်အခဲ ကြသည်。 စစ်ဆေးခြင်း

နည်းပါးလျက် အချက်အလက်

မူကြမ်း အဆိုပါ အခြေခံ none
အဆိုပါ အခြေခံ ကို တိုက်ရိုက် လက်ခံကြသည် no
ပုံစံ CSS3
JavaScript လိုက်ကူး object.style.boxShadow="10px 10px 5px #888888"

အခြား အမှတ်အသား

အခြေခံ အပေါ် နှုတ်ခတ်ခဲ့သော ရုပ်ပုံ
“ပိုလီယာ” ရုပ်ပုံ ကို ဖန်တီးခြင်း နှင့် ရုပ်ပုံ ကို ကျန်းမြူခြင်း ကို ပြသည်。

ဘာသာစကား အပေါ် အကူအညီ

အချက်အလက် စာတမ်းတွင် အခြေခံ ကုန်းမှန်းခြေ ကို သတ်မှတ်ထားသော ဘာသာစကား ကို ညွှန်ပြသည်。

နှင့် -webkit- သို့မဟုတ် -moz- ဟူသော နေရာများ က ပထမဆုံး ပုံစံ ကို အသုံးပြုခြင်း ကို ညွှန်ပြသည်。

Chrome IE / Edge Firefox Safari Opera
10.0
4.0 -webkit-		 9.0 4.0
3.5 -moz-		 5.1
3.1 -webkit-		 10.5