解决ie8下background-size不兼容问题

最新推荐文章于 2024-08-10 07:07:47 发布

yxing1993

最新推荐文章于 2024-08-10 07:07:47 发布

阅读量3.7k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.youkuaiyun.com/weixin_42782396/article/details/82655658

本文介绍了解决CSS中背景图与容器大小不一致导致的问题的方法。通过使用background-size属性结合特定浏览器的hack技巧，确保图片能正确填充整个容器。

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

如果容器大小与背景图大小一致，页面显示无问题，如果不一致，则会出现问题，background-size失效，解决方法：

background: url(../img/img.png) no-repeat center center;
background-size: 100% 100%;
background: none\9;
filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='img/img.png', sizingMethod='scale');

注意filter内src路径是相对html，不是相对css

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

yxing1993

关注关注

1
点赞
踩
5

收藏

觉得还不错? 一键收藏
3
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

IE不支持background-image动画

qq_44170340的博客

07-30

632

IE不支持background-image动画刚刚学了CSS3 animation，高兴的想要制作一个动图，却发现代码没有错，然而就是无效，背景图片过渡和颜色动画却是可以，困惑了很久，最后发现是浏览器的问题，IE浏览器似乎不支持background-image:url（）动画，然后重新下载了一个谷歌浏览器就ok了。背景图片动画 <!DOCTYPE html> <html&gt...

IE8兼容性问题及解决方案

随心而作

08-09

1万+

前言最近在做一个项目，要求是兼容IE8，还要兼容1280屏幕分辨率，写页面其实还好，就是这个IE8贼恶心，用到的很多css属性IE8都不兼容，想要的效果也呈现不出来。先来说一说我遇到的IE8不支持的哪些css属性吧 1，background不支持连写 background:url(../img/background.png) no-repeat -580px 0/auto 100%; *...

3 条评论您还未登录，请先登录后发表或查看评论

解决XP IE8不支持css3的background-size问题实例

04-06

解决XP IE8不支持background-size问题的html文件实例。

background-size IE8兼容方案

weixin_34396902的博客

03-20

189

2017.7.5更新：在处理IE8兼容性问题上，对于背景图片比背景框还大的情况，还需要做一下处理： 1 /*针对IE8的hack，目的是除掉之前background*/ 2 background:none\9; 根据canius（http://caniuse.com/#search=background-size），backgroun...

IE8兼容background-size属性

hangGe0111的博客

08-20

4373

转载：https://blog.youkuaiyun.com/lxtlog/article/details/53256315 1.简介 background-size是CSS3新增的属性，但是IE8以下还是不支持，可以通过滤镜来实现这样的一个效果 background-size：contain; // 缩小图片来适应元素的尺寸（保持像素的长宽比）； background-size ：cover; // 扩...

IE8下实现兼容rgba

weixin_34121304的博客

01-14

191

昨天遇到一个问题，要实现一个背景透明的效果，用CSS3用rgba()就能实现，即 background: rgba(0,0,0,.5); 但是要兼容到IE8，就发现没有透明效果，因为IE8不支持rgba()函数。下面我们总结一下rgba()函数的含义。 rgba的含义，r代表red，g代表green，b代表blue，a代表透明度。红绿蓝...

background-size兼容IE8解决方案

热门推荐

fb_01的专栏

12-09

1万+

1、通过滤镜的方法 body{ background: url(../images/login_register/login-register-background.jpg) no-repeat center; -webkit-background-size: cover; -moz-background-size: cover; -o-bac

css3中背景尺寸background-size详解

09-25

在编写样式表时，可以通过JavaScript直接操作DOM元素的style属性来动态设置background-size，例如：document.getElementById('element').style.backgroundSize = '100px 200px';。这允许开发者在页面运行时根据用户...

解决IE6、IE7、IE8样式不兼容问题

06-02

本文将深入探讨如何解决IE6、IE7、IE8下的样式兼容性问题，包括但不限于CSS hack技术、布局调整策略以及脚本修复方案。 #### 二、CSS Hack技术 **1. Conditional Comments与X-UA-Compatible** 为了区分不同的IE...

IE8兼容background-size

xiaoouh的博客

02-18

4339

因为background-size是CSS3的属性，所以IE8并不支持。可以采用滤镜来支持，即在IE不支持这个属性的时候可以通过滤镜来实现这样的一个效果。代码如下： strong>background-image: url('file:///F:/test/images/flashbg.jpg'); background-size: cover; filter

解决IE8不兼容 background-size

weixin_34087503的博客

01-31

609

IE8下，使用background-size适应盒子大小时不兼容，效果如下图：网上找资料，说添加如下代码可以兼容IE8 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/Style Library/hry/images/logo.png',sizingMethod='scale'); 于是加...

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...

IE8兼容background-size方法

weixin_41612533的博客

08-08

353

大家都知道background-size这个属性并不兼容ie8，如果解决这个问题呢？网络上通常会用ie的滤镜来解决这个方法，具体的代码如下： filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../img/logo.png', sizingMethod='scale'); 然后发现logo变得十分华丽（奥义·双重l...

background-size 兼容ie8

小嘞嘞的专栏

05-20

501

调试bannert背景图片时，在ie8下图片没有布满，后才知道 ie8不支持background-size. 只需要加一句话就可以让ie8下背景图片布满 filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='${article.showimg}',sizingMethod='scale');">

IE8下兼容background-size方法

zhpeng289的博客

07-30

1万+

background-size: length|percentage|cover|contain;IE9+、Firefox 4+、Opera、Chrome 以及 Safari 5+ 支持 background-size 属性。 CSS3 新增的 background-size 是一个很有用的属性，用于定义背景图片的尺寸，有了这个属性，你就可以任意指定背景图片的大小。其中最常用的值应该要...

使用背景尺寸（background-size）的IE8兼容性解决方案：background-size-polyfill

最新发布

gitblog_00714的博客

08-10

351

使用背景尺寸（background-size）的IE8兼容性解决方案：background-size-polyfill 如果你在开发过程中曾经因为无法在IE8中实现CSS3的background-size特性而感到困扰，那么这款名为background-size-polyfill的开源项目可能会是你的一把利器。这个由@louis_remi最初创建，并由@jefferyto维护的项目，旨在为IE8添...

IE8支持background-size

勿忘初心

01-12

382

下载backgroundsize.min.htc放到文件夹里，原理是创建一个 img 元素插入到容器中，并重新计算宽度、高度、left、top 等值，模拟 background-size 的效果。然后在样式中只需要这么写上几句就可以了。.main { background: url(images/1.jpg) no-repeat; background-size: cover;

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

664

background-size在IE8及以下浏览器不兼容；要解决的话要用滤镜：　　filter:progid:DXImageTransform.Microsoft.AlphaImageLoade...

解决IE6/7/8兼容问题：前端Hack使用指南

在没有原生支持的情况下，background-size.h文件通过一系列的兼容性“hack”提供了一种解决方案，使得在IE6至IE8的环境中，开发者仍然可以利用这个属性。 IE6、IE7和IE8浏览器的兼容性问题一直是前端开发的痛点。...