IE8下的背景平铺 background-size不起作用

最新推荐文章于 2021-09-02 10:55:08 发布
原创 最新推荐文章于 2021-09-02 10:55:08 发布 · 5.8k 阅读 · 0 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。

本文介绍了在Internet Explorer浏览器中实现背景图片等比例缩放的方法。通过使用特定的滤镜属性，可以确保背景图片在不同浏览器环境下的显示效果一致。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

今天在写项目的时候，用到了background-size:cover。在chrome上面预览很正常。


但是跑到IE下面一看。虽然有background-image 的属性。但是效果不能如愿。


后来，在网上查到需要用滤镜解决拉伸问题。

代码如下：

filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='1.jpg', sizingMethod='scale'); -ms-filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='1.ipg', sizingMethod='scale');

把src改成你的路径即可！



[转]完美的背景图全屏css代码 – background-size:cover?
weixin_30498921的博客
03-16 2641
写主题样式的时候经常会碰到用背景图铺满整个背景的需求，这里分享下使用方法 需要的效果 图片以背景的形式铺满整个屏幕，不留空白区域 保持图像的纵横比（图片不变形） 图片居中 不出现滚动条 多浏览器支持 以图片bg.jpg为例 方法一、最简单，最高效的方法 CSS3.0 归功于css3.0新增的一个属性background-size，可以简单的实现这个效果，这里用fixed和...
解决XP IE8不支持css3的background-size问题实例
04-06
解决XP IE8不支持background-size问题的html文件实例。
ie8下background-size不起作用
笑到世界都狼狈的博客
09-06 995
最近做项目，ie8下的background-size不起作用，网上发现有个backgroundsize.min.htc火腿肠文件，下载导入项目css文件中 然后在需要的css样式中导入就可以了，具体上代码： /*兼容ie8下的background-size属性*/ .middle{ -ms-behavior: url(../css/backgroundsize.min.htc);//...
background-size在IE8不兼容问题
u011927449的博客
01-18 667
background-size在IE8及以下浏览器不兼容；要解决的话要用滤镜： 　　filter:progid:DXImageTransform.Microsoft.AlphaImageLoade...
ie8下背景图片平铺问题
weixin_30735745的博客
05-30 222
IE9+及其他浏览器实现背景图片平铺可能需要一个属性就可以background-size:100%/cover; 但是ie8下background-size是不兼容的，因此我们需要用到滤镜，来解决背景图片拉伸问题。 仅需如下代码： filter: progid:DXImageTransform.Microsoft.AlphaImageLoader( src='../img/news/n...
ie8下平铺背景图
duansamve的博客
04-29 511
body{ background: #ffffff url('{{STATIC_URL}}img/banner.png') no-repeat scroll center center; -webkit-background-size: cover; -moz-background-size: cover; -o-background-size: cover...
layui弹出层样式修改，使用css的background属性设置多个背景图附件
02-24
`background`属性的多个值支持在现代浏览器中都表现良好，但老版本的IE浏览器可能不支持。因此，对于这类情况，可以使用`background-image`, `background-repeat`, `background-position`等单独的属性进行逐步增强，...
深入学习CSS background-repeat属性
- 当背景图像用于覆盖整个元素时，`background-repeat`配合`background-size`的`cover`值，能够使图像覆盖整个元素而不失真。 - `background-repeat`和`background-size`的`contain`值一起使用时，图像能够完全...
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> <style> </style> </head> <body background="bgImage.jpg" style="background-repeat:no-repeat;background-attachment:fixed; background-size:100% 100%; "> </body> </html>
06-08
具体来说，`background-repeat:no-repeat` 表示不重复平铺背景图片，`background-attachment:fixed` 表示固定背景图片不随页面滚动而移动，`background-size:100% 100%` 表示背景图片的宽度和高度都填充整个页面。
ie8不支持background-size怎么解决
weixin_43959024的博客
08-22 528
利用IE 提供的CSS渲染来处理 background:url(' +data[i].imageUrl +') center top no-repeat; background-size: cover; filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='+ data[i].imageUrl +', sizingMet...
jquery.backgroundSize.js
03-19
引入后可以用过调用兼容IE8样式的方法
解决IE浏览器部分版本不支持background-size属性问题
热门推荐
道阻且长，行则将至
12-02 2万+
background-size是CSS3新增的属性，现在有很多浏览器都支持CSS3了。但是IE浏览器有些版本还是不支持，比如IE8，IE9也有些CSS3的属性会支持，但是有些也不支持。在这里就了解一下CSS3的background-size。 background-size 属性 1、定义： background-size 用来调整背景图像的尺寸大小。以象素或百分比显示，当指定为百分
background-size设置背景图片自适应 在ie8下失效的问题
oliver666666的博客
04-27 1万+
遇到的问题是 ：有一个div ，div用绿色框体现。然后通过js控制框的大小，实现动态的改变div的大小。 （放大缩小窗口，div跟随变大变小。） 设置了div的css属性  background-image：url(http://i1.piimg.com/1949/c777d079f3fb68ec.png); background-size：cover； 通过浏览器使用发现，div框
IE8兼容background-size方法
weixin_41612533的博客
08-08 354
大家都知道background-size这个属性并不兼容ie8，如果解决这个问题呢？网络上通常会用ie的滤镜来解决这个方法，具体的代码如下： filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/logo.png', sizingMethod='scale'); 然后发现logo变得十分华丽（奥义·双重l...
IE浏览器下 background-size失效的问题解决
qq_38472574的博客
09-02 240
IE浏览器下 background-size失效的问题解决
解决IE8不兼容 background-size
weixin_34087503的博客
01-31 610
IE8下，使用background-size适应盒子大小时不兼容，效果如下图： 网上找资料，说添加如下代码可以兼容IE8 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Style Library/hry/images/logo.png',sizingMethod='scale'); 于是加...
解决ie8下background-size不兼容问题
weixin_42782396的博客
09-12 3743
如果容器大小与背景图大小一致，页面显示无问题，如果不一致，则会出现问题，background-size失效，解决方法： background: url(../img/img.png) no-repeat center center; background-size: 100% 100%; background: none\9; filter: progid:DXImageTransform.Mi...
背景图片在IE8浏览器的平铺
李曼 'S BLOG
07-04 1771
当给页面设置背景图片时，我们习惯性的会如下设置，由于背景图片在IE8下不能平铺，因此这样设置无法兼容IE8浏览器的，不能得到我们想要的效果 &amp;amp;lt;div id=&amp;quot;login_bg&amp;quot; class=&amp;quot;login_bg&amp;quot; &amp;amp;gt; &amp;amp;lt;style type=&amp;quot;text/css&amp;quot;&a
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值