စက်တင်ပြတ် အပုံအပြင်

ကြည့်မှန်းချက် နှင့် အသုံးပြုခြင်း

image-rendering 属性指定用于图像缩放的算法类型。

注意：此属性对未缩放的图像无效。

实例

展示可用于图像缩放的不同算法：

.image {
  height: 100px;
  width: 100px;
  image-rendering: auto;
}
.crisp-edges {
  image-rendering: -webkit-optimize-contrast;
  image-rendering: crisp-edges;
}
.pixelated {
  image-rendering: pixelated;
}
.smooth {
  image-rendering: smooth;
}
.high-quality {
  image-rendering: high-quality;
}

亲自试一试

CSS 语法

image-rendering: auto|smooth|high-quality|crisp-edges|pixelated|initial|inherit;

属性值

值 描述
auto 让浏览器选择缩放算法。默认值。
smooth 使用一种算法来平滑图像中的颜色
high-quality 与 smooth 相同，但更偏好高质量的缩放
crisp-edges 使用一种算法来保留图像中的对比度和边缘
pixelated

如果图像被放大，则使用最近邻算法，因此图像将看起来由大像素组成。

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

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

မူကြမ်း အဆိုပါ အကျိုးဆက် auto
အဆိုပါ အကျိုးဆက် ကို မိဘ အကျိုးဆက် မှ သိရှိရသည်။ ကျမ်းကြည့် yes
အသံအတူ ပုံစံ မမြင်တွေ့ရ၊ ကျမ်းကို ကြည့်ပါ။အသံအတူ အခြေခံ အကျိုးဆက်。
ပုံစံ: CSS3
JavaScript ဘာသာစကား: object.style.imageRendering="pixelated"

ဘာသာ ကုဒ် ထောက်ပံ့

အချက်အလက်များ သည် အဆိုပါ အကျိုးဆက် အခြေခံ ဘာသာ ကို အထူး ထောက်ပံ့ သော ဘာသာ ကုဒ် အချိန် ကို အမှတ်အသားပြုထားသည်။

ခရိုးမိုး အန်းဂျီ ဖက်ဒရယ် ဆိုဖ်ဖ် အိုပရား
41.0 79.0 65.0 10.0 28.0

ခရိုးမိုး၊ အန်းဂျီ နှင့် အိုပရား က -webkit-optimize-contrast ကို crisp-edges အားလုံး အမှတ်အသား အဖြစ် အသုံးပြုကြသည်။