注册 登录  
 加关注
   显示下一条  |  关闭
温馨提示!由于新浪微博认证机制调整,您的新浪微博帐号绑定已过期,请重新绑定!立即重新绑定新浪微博》  |  关闭

伯纳乌の夢

可以挽回么?我们按“ Ctrl+Z”撤销掉吧。对不起啦~~

 
 
 

日志

 
 
 
 

IE背景图片显示100%(背景图片自动伸缩 自适应)  

2014-01-27 17:45:04|  分类: 默认分类 |  标签: |举报 |字号 订阅

  下载LOFTER 我的照片书  |
 

程式中往往會加入背景圖片,背景圖片的大小比終端設備大,

如何要使背景圖片能自動伸縮,自適應終端設備。

1)Firefox/Chrome
           #divFixed
          {
               background-image:url('bg.jpg');
               background-attachment:fixed;
               background-size:100% 100%;
           }

    2)IE8
#divFixed
  {
   background-image:url('bg.jpg');
  background-attachment:fixed;
  background-size:100% 100%;
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='bg.jpg',sizingMethod='scale');
 }

  為什麽會分兩段,主要是IE8以下不支持CSS3

AlphaImageLoader兼容性:IE5.5+
语法:
filter : progid:DXImageTransform.Microsoft.AlphaImageLoader ( enabled=bEnabled , sizingMethod=sSize , src=sURL )
属性:
enabled : 
可选项。布尔值(Boolean)。设置或检索滤镜是否激活。true | false
true: 
默认值。滤镜激活。
false: 
滤镜被禁止。
sizingMethod: 
可选项。字符串(String)。设置或检索滤镜作用的对象的图片在对象容器边界内的显示方式。
crop: 
剪切图片以适应对象尺寸。
image: 
默认值。增大或减小对象的尺寸边界以适应图片的尺寸。
scale: 
缩放图片以适应对象的尺寸边界。
src: 
必选项。字符串(String)。使用绝对或相对 url 地址指定背景图像。假如忽略此参数,滤镜将不会作用。
特性:
Enabled: 
可读写。布尔值(Boolean)。参阅 enabled 属性。
sizingMethod: 
可读写。字符串(String)。参阅 sizingMethod 属性。
src: 
可读写。字符串(String)。参阅 src 属性。
说明:
在对象容器边界内,在对象的背景和内容之间显示一张图片。并提供对此图片的剪切和改变尺寸的操作。如果载入的是PNG(Portable Network Graphics)格式,则0%-100%的透明度也被提供。
PNG(Portable Network Graphics)格式的图片的透明度不妨碍你选择文本。也就是说,你可以选择显示在PNG(Portable Network Graphics)格式的图片完全透明区域后面的内容。
  评论这张
 
阅读(2085)| 评论(0)
推荐 转载

历史上的今天

评论

<#--最新日志,群博日志--> <#--推荐日志--> <#--引用记录--> <#--博主推荐--> <#--随机阅读--> <#--首页推荐--> <#--历史上的今天--> <#--被推荐日志--> <#--上一篇,下一篇--> <#-- 热度 --> <#-- 网易新闻广告 --> <#--右边模块结构--> <#--评论模块结构--> <#--引用模块结构--> <#--博主发起的投票-->
 
 
 
 
 
 
 
 
 
 
 
 
 
 

页脚

网易公司版权所有 ©1997-2017