标准浏览器通过background-size属性设置;IE8以下通过滤镜实现。

代码如下:

 /* IE8 */
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='demo.jpg', sizingMethod='scale');
-ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='demo.jpg', sizingMethod='scale'); /* 标准浏览器 */
background-size: cover;

上述代码中:

  1. 参数 src 是图片路径,sizingMethod = 'scale' 表示滤镜的尺寸方法为自适应容器大小;
  2. cover表示:将背景图像等比缩放到完全覆盖容器,背景图像有可能超出容器。

背景平铺(兼容IE8)的更多相关文章

  1. 手机端浏览器适配,background 背景平铺 ,有的出不来

    .mobilePage .report { background: url(../images/mobile-report.png) repeat; background-size: 100% :/* ...

  2. php 给图片增加背景平铺水印代码

    如果你想利用php 给图片增加背景平铺水印效果话,必须利用php的一个插件来实例,就是利用imagick,他可以给图片增加背景平铺水印效果哦,下面我们提供一款实例代码. 如果你想利用php教程 给图片 ...

  3. 背景图片background-size兼容ie8以下浏览器解决

    背景图片不够大,然后就想到用background-size:100%; 测试浏览器的时候发现ie8以下不兼容,图片会自动填充平铺过去,然后出现背景不好看的现象.解决方法: background-ima ...

  4. android背景平铺方式 tileMode

    创建重复的背景图片  在drawable目录下创建一个repeat_bg.xml:    然后在布局的xml文件中可以这样引用:    ================================ ...

  5. 透明(颜色)渐变背景(颜色透明背景),兼容IE8

    filter: progid:DXImageTransform.Microsoft.gradient (GradientType=0, startColorstr=#00000000, endColo ...

  6. HTML布局排版2 div的和图片平铺方便管理

    在HTML里,由于浏览器显示器等差异,浏览器的宽度也会有变化,为了适应不同的宽度,需要用到平铺.例如页面前面的固定的条等,如果是纯色,可以用背景色,如果不是纯色,是渐变等,可以用条状图平铺.常见的布局 ...

  7. ie8下背景图片平铺问题

    IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover; 但是ie8下background-size是不兼容的,因此我们需要用到滤镜,来解决背景 ...

  8. CSS背景100%平铺 浏览器缩小背景显示不全解决办法

    本文我们分享前端CSS背景100%平铺,浏览器缩小背景显示不全bug解决的两个方法,如果你也遇到了,那么就可以参考下面文章. 把浏览器的窗口缩小时,拖动滚动条时你会发现原本设定的CSS背景100%平铺 ...

  9. Android中设定背景图片平铺。

    注:本文由Colin撰写,版权所有!转载请注明原文地址,谢谢合作! 在做Android开发时,我们常常需要为程序设定一个背景,但由于现在的Android设备尺寸不一,如果随便设置一个图片为背景,那么很 ...

随机推荐

  1. [Vuejs] 组件 v-if 和 v-show 切换时生命周期钩子的执行

    v-if 初始渲染 初始值为 false 组件不会渲染,生命周期钩子不会执行,v-if 的渲染是惰性的. 初始值为 true 时,组件会进行渲染,并依次执行 beforeCreate,created, ...

  2. Tomcat 启动成功后报 INFO [Timer-0] org.apache.catalina.loader.WebappClassLoaderBase.checkStateForResourceLoading Illegal access:

    Tomcat 启动成功后报 INFO [Timer-0] org.apache.catalina.loader.WebappClassLoaderBase.checkStateForResourceL ...

  3. SpringMvc 启动原理源码分析

    了解一个项目启动如何实现是了解一个框架底层实现的一个必不可少的环节.从使用步骤来看,我们一般是引入包之后,配置web.xml文件.官方文档示例的配置如下: <web-app> <se ...

  4. postgresql-清空shared_buffers

    清空os缓存,shared_buffers 1.停止数据库 pg_ctl -m fast -D /pgdata stop 2.清空高速缓存前尝试将数据刷新至磁盘 sync 3.清空缓存 echo 3 ...

  5. 线性表java实现

    顺序表 public class SequenceList { /* * content,节点内容 * location,节点在表中的位置(序号) * */ private String conten ...

  6. java操作数据库的基本方法

    此次开发工具为eclipse,才有的数据库驱动是mysql-connector-java-5.1.8-bin.jar 第一步,在eclipse的工程目录中引用mysql驱动 驱动下载地址:https: ...

  7. [原创]K8 CMS GoastGuard 密码解密工具

    工具: K8 CMS GoastGuard PASS Decrypt编译: VS2012  C# (.NET Framework v4.5)组织: K8搞基大队[K8team]作者: K8拉登哥哥博客 ...

  8. Flask-socketio聊天室 (附源码)

    `* A Chat Room Completed with Flask-socketio 功能: 实时消息更新,实时用户上线显示 快捷注册 快捷登陆 表情支持 截图: 使用方法: 安装依赖:pip i ...

  9. (转) argparse — 解析命令参数和选项

    原文地址:https://pythoncaff.com/docs/pymotw/argparse-command-line-option-and-argument-parsing/166 https: ...

  10. JavaSE-java8-谓词复合的用法

    谓词接口包括三个方法: negate. and 和 or,让你可以重用已有的Predicate来创建更复杂的谓词 一.比如可以用negate方法来返回一个Predicate非 public class ...