စီစဥ်ရိုက်နှာချက် object-fit အကိုးအချုပ်

定义和用法

object-fit 属性用于规定应如何调整 或

这个属性告知内容以何种方式填充容器。例如“保留长宽比”或“展开并占用尽可能多的空间”。

另请参阅：

CSS 教程：CSS object-fit

CSS 参考手册：CSS object-position

HTML DOM 参考手册：objectFit 属性

实例

အောက်ပါ အရွယ်အစားများ အစားထိုးပြီး အဆိုပါ အရွယ်အစားများ အပိုင်းအခြားမှ အဆိုပါ အရွယ်အစားကို ကူးယူပါ။

img.a {
  width: 200px;
  height: 400px;
  object-fit: cover;
}

ကိုယ်တိုင် ကျင်းပပါ

CSS ဘာသာစကား

object-fit: fill|contain|cover|scale-down|none|initial|inherit;

ဗီဇ အတ္ထုပတ္တိ

အတ္ထုပတ္တိ ဖော်ပြ
fill မည်သည့် အရာမဆို အတိုင်း အဆိုပါ အရွယ်အစားများ အစားထိုးခြင်း ပြုလုပ်ပါ။ အဆိုပါ အရွယ်အစားမှ အဆိုပါ အရွယ်အစားကို ကူးယူပါ။ အကျိုးသက်ရှိသော အခါ အဆိုပါ အရွယ်အစားကို အစားထိုးပြီး အဆိုပါ အရွယ်အစားကို အစားထိုးပါ။
contain အဆိုပါ အောက်ပါ အရွယ်အစားများ အစားထိုးခြင်း ပြုလုပ်ပြီး အဆိုပါ အရွယ်အစားများ အဆိုပါ အရွယ်အစားမှ အဆိုပါ အရွယ်အစားကို ကူးယူပါ။
cover အဆိုပါ အောက်ပါ အရွယ်အစားများ အစားထိုးခြင်း ပြုလုပ်ပြီး ပါဝါ အရွယ်အစားများ အပိုင်းအခြားမှ အဆိုပါ အရွယ်အစားကို ကူးယူပါ။ အဆိုပါ အရွယ်အစားမှ အဆိုပါ အရွယ်အစားကို ကူးယူပါ။
none အဆိုပါ အောက်ပါ အရွယ်အစားများ အစားထိုးခြင်း မရှိပါ။
scale-down ပါဝါ အရွယ်အစားများသည် none သို့မဟုတ် contain တွင် တူညီပါ။ အဆိုပါ အရွယ်အစားများသည် အဆိုပါ အရွယ်အစားများအကြား အဆိုပါ အရွယ်အစားမှ အဆိုပါ အရွယ်အစား အသင့်မတူ ဖြစ်ပါက အဆိုပါ အရွယ်အစားကို ကူးယူပါ။
initial အဆိုပါ ဗီဇကို မည်သည့် အတိုင်း မည်သည့် အရာမဆို ကူးယူပါ။ ကြည့်ပါ: initial.
inherit အဖွဲ့ဝင် အပိုင်းအခြားမှ အဆိုပါ ဗီဇကို ကူးယူပါ။ ကြည့်ပါ: inherit.

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

မည်သည့် အရာမဆို အတိုင်း ကူးယူမှု: သီးခြား ဗီဇကို ကြည့်ပါ。
ကူးယူမှု: ထိပ်သတ်
လှည့်ပတ် ပြုလုပ်မှု: ထောက်ပံ့ခြင်း မရှိပါ။ ကျမ်းကို ကြည့်ပါ:လှည့်ပတ် ဗီဇများ.
ပုံစံ: CSS3
JavaScript ဘာသာစကား: object.style.objectFit="cover"

ဘာသာစကား ထောက်ပံ့

အချက်အလက်များတွင် အဆိုပါ ဗီဇကို အထူးသဖြင့် ထောက်ပံ့သော ဘာသာစကား ဘာသာပြန်များ ကို သတ်မှတ်ထားသည်。

Chrome IE / Edge Firefox Safari Opera
31.0 16.0 36.0 7.1 19.0