突然有人问我这个问题，说网上CSS filter的方法在非IE浏览器下不奏效。思考之后，问题之外让我感慨万千啊，很多我们所谓的难题，都会随着时代的发展迎刃而解，或被新的问题所取代。

当CSS背景图片拉伸这个问题产生时，CSS3也只是浮云....

对于IE而言网上常见的方法是使用CSS滤镜，但那时Firefox还小，Chrome还没出生，IE称霸天下....。但如今，我们用三四行简短的代码就能实现全浏览器兼容的方法：

.bg{

background:url(http://wyz.67ge.com/wp-content/uploads/qzlogo.jpg);

filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod='scale')";

-moz-background-size:100% 100%;

    background-size:100% 100%;

}

源码调试：http://jsfiddle.net/wyongzhi/r3vM7/

CSS背景图拉伸自适应尺寸，全浏览器兼容的更多相关文章

  1. CSS背景图拉伸自适应尺寸

    .bg{ background:url(images/test.jpg); filter:"progid:DXImageTransform.Microsoft.AlphaImageLoade ...

  2. CSS背景图怎么自适应全屏（手机或者电脑）

    #demo{ background-img:url(../bg.png); --(1)适用于上半部分背景图片,下半部分纯色 将背景图像等比缩放到完全覆盖屏幕,背景图有可能超出屏幕(容器) backgr ...

  3. CSS背景图拉伸不变形

    在线效果体验:http://hovertree.com/texiao/mobile/3.htm 请使用手机浏览器查看. css代码: .bg{ background:url(http://hovert ...

  4. 兼容各浏览器的css背景图片拉伸代码

    需要用到背景图拉伸,找到了下面这段css代码: filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='***.jpg' , s ...

  5. css背景图片拉伸 以及100% 满屏显示

    如何用css背景图片拉伸 以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在 ...

  6. 项目期复习总结1：背景图合并，hack，浏览器内核前缀，伪类after before

    文件夹: 1.背景图合并和CSS Spirit 2.PS基本快捷键 3.hack技术基本书写,为什么不用? 4.内核前缀 5.伪类afterbefore 1.背景图合并和CSS Spirit 背景图合 ...

  7. css背景图与html插入img的区别

    一直以来都认为css背景图与直接插入img图片的效果是差不多的,直到最近拜读了一位大神的作品,发现大部分图片都是通过背景图形式显示的,于是通过搜索各相关资料,在此总结了下二者的区别: 1. css中的 ...

  8. Lodop打印控件不打印css背景图怎么办

    background:url()这是css背景图,http协议会按异步方式下载背景图,所以很容易等不到下载完毕就开始打印了,故lodop不打印css背景图.Lodop不打印css背景图,但是有其他方法 ...

  9. css背景图片拉伸

    css背景图片拉伸 background-image:url(bg.png); -moz-background-size: 100% 100%; -o-background-size: 100% 10 ...

随机推荐

  1. 代理模式 （Proxy Pattern）

    代理模式的定义:为其他对象提供一种代理以控制对这个对象的访问.而对一个对象进行访问控制的一个原因是为了只有在我们确实需要这个对象时才对它进行创建和初始化.在某些情况下,一个对象不适合或者不能直接引用另 ...

  2. 源码分析：Java对象的内存分配

    Java对象的分配,根据其过程,将其分为快速分配和慢速分配两种形式,其中快速分配使用无锁的指针碰撞技术在新生代的Eden区上进行分配,而慢速分配根据堆的实现方式.GC的实现方式.代的实现方式不同而具有 ...

  3. List remove注意点

    public class ListTest { public static void main(String[] args) { // TODO Auto-generated method stub ...

  4. jq+jsonp+ajax解决跨域问题

    Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料. 关于Jsonp更详细的资料请参考http://baike.baidu.com/ ...

  5. SQL 表 和字符串 互转 (行列互转)

    -- 表转字符串 )) ,,'') --字符串转表 ),)) ,) )) AS BEGIN DECLARE @StartIndex INT --开始查找的位置 DECLARE @FindIndex I ...

  6. 使用-MM生成include指令和依赖生成(make include directive and dependency generation with -MM)

    I want a build rule to be triggered by an include directive if the target of the include is out of d ...

  7. 快速求n的质因子(数论)

    快速求n的质因子 如何尽快地求出n的质因子呢?我们这里又涉及两个好的算法了! 第一个:用于每次只能求出一个数的质因子,适用于题目中给的n的个数不是很多,但是n又特别大的 #include<std ...

  8. gc之四--Minor GC、Major GC和Full GC之间的区别

    针对HotSpot VM的实现,它里面的GC其实准确分类只有两大种: Partial GC:并不收集整个GC堆的模式 Young GC:只收集young gen的GC Old GC:只收集old ge ...

  9. emacs使用 simple-httpd和impatient-mode插件实现livereload

    现在用emacs写前段,自然想实现那种,编辑器里编辑,然后浏览器端页面自己刷新 使用 simple-httpd 和impatient-mode 两个插件,可以实现, 按照文档安装好使用就可以,我没找到 ...

  10. 编译错误：error: multi-line comment

    编译错误:error: multi-line comment  这其实是有宏定义的地方的问题. 原因是宏定义非一行,在宏定义的行尾使用 '\' 连接符导致的. 所以这个地方的注释使用 /*   */ ...