zoukankan      html  css  js  c++  java
  • html css img 图片设置宽高厚,图片失真模糊问题-已解决 image-rendering

     
    定义缩放算法的

    img {    

    image-rendering: -moz-crisp-edges; /* Firefox */     
    image-rendering: -o-crisp-edges; /* Opera */      
    image-rendering: -webkit-optimize-contrast; /*Webkit (non-standard naming) */ image-rendering: crisp-edges; 
    -ms-interpolation-mode: nearest-neighbor; /* IE (non-standard property) */

    }

    image-rendering说明

    dome:

    /* Keyword values */
    image-rendering: auto;
    image-rendering: crisp-edges;
    image-rendering: pixelated;
    
    /* Global values */
    image-rendering: inherit;
    image-rendering: initial;
    image-rendering: unset

     属性值说明:

    auto:默认值。使用浏览器的标准算法最大化图像的外观;

    crisp-edges:使用算法达达到在绽放时保持对比度和边缘,在加工时不平滑色彩和使用模糊

    pixelated:当图片放大时,单纯地去放大像素点,缩小时与auto效果一样,即矢量化;

    注:此属性可应用于背景图像、canvas元素、打印图片设置以及内联图像。重要的是要注意,这些值尤其令人困惑,因为缺乏一致的浏览器支持。

    参考文献:https://my.oschina.net/u/1403186/blog/1509962

     
  • 相关阅读:
    [转]虚拟机下Redhat Linux系统的Mplayer安装实现
    结构定义中元素位置排列问题
    RPM 的介绍和应用
    yum 升级 rhe15
    Microsoft Access Data Types
    Eclipse配置SVN
    搭建本地YUM软件仓库
    2011年度最佳开源软件:Bossie奖结果公布
    Linux中文man在线手册
    PID算法
  • 原文地址:https://www.cnblogs.com/jidanbufan/p/14913772.html
Copyright © 2011-2022 走看看