IE8兼容性问题及解决方案

开发者福利!热门AI工具限时免费用 购周边即赠Coding Plan Lite,Claude Code、Cursor等20+工具畅享,效率翻倍! 阅读详情

前言

最近在做一个项目,要求是兼容IE8,还要兼容1280屏幕分辨率,写页面其实还好,就是这个IE8贼恶心,用到的很多css属性IE8都不兼容,想要的效果也呈现不出来。先来说一说我遇到的IE8不支持的哪些css属性吧

1,background不支持连写

background:url(../img/background.png) no-repeat -580px 0/auto 100%; */

这段代码在谷歌浏览器上显示正常,在ie8上就有问题,需要分开写

background: url(/portal/themes/boss/login/imgs/background.jpg) center;
    background-repeat: no-repeat;
    background-position-x:-580px;
    background-position-y:0;
    -o-background-size: auto 100%;
    background-size: auto 100%; 
    /* 兼容background-size */
    -ms-behavior: url(/portal/themes/boss/login/css/backgroundsize.min.htc);
    behavior: url(/portal/themes/boss/login/css/backgroundsize.min.htc);

这里需要注意的是需要下载一个后缀名儿是.htc的一个文件,用来兼容ie8的background-size,使背景图正常显示;路径一定要是绝对路径才可以;

2, border-radius 圆角

圆角在ie8下也是不支持的,需要下载一个文件PIE.htc,亲测有效,代码如下:


        
编程小白的自学笔记四(正则表达式模块search函数) 本文仅仅简单介绍了search的使用,供小白学习探讨。 阅读详情

相关推荐

避坑指南:SAP成本中心分割结构配置常见错误及解决(含KA06/KL01前置步骤)

本文深入解析了SAP成本中心会计中分割结构配置的关键步骤与常见错误。重点强调了配置前必须通过KA06创建次级成本要素(类别42)和通过KL01创建活动类型这两个核心前置步骤,并详细剖析了在OKES中定义分割规则及版本时的高频报错原因与解决方案,帮助顾问和运维人员有效规避配置陷阱,确保成本分摊的准确性。

pear55的博客 840

behavior: url(PIE.htc)在:hover中失效问题解决(ie8兼容)

解决办法:将 behavior: url(PIE.htc) 移动至标签样式下 不生效: a:hover{ background:#fff; border-radius:55px; behavior: url(PIE.htc); } 生效: a { behavior: url(PIE.htc); } a:hover{ background:#fff; ...

HuangsTing的博客 1189

YOLO11改进 | 注意力机制 | 添加SimAM注意力机制【全网独家+附完整代码】

yolo11,yolo11改进,yolo11创新,yolo11添加注意力机制

kay_545 1189

关于background-position的一些使用方法

一、使用background-position的四个值语法。如果希望能够兼容所有浏览器,使用JavaScript。注意:使用calc() 运算符号之间要有空格。/* ie7,ie8支持 */三、使用JavaScript。二、使用 calc()

weixin_43565197的博客 685

IE css3常用属性兼容性

min-width,min-height,max-width,max-height:ie7+ vw, vh, vmin, vmax:ie9+局部支持 box-sizing:ie8+ @media:ie9+

我是新手F1的专栏 689

IE8\IE9中的颜色渐变CSS代码及其他笔记

-ms-filter:"progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=red(开始颜色),endColorstr=blue;(结束颜色) )";其他现代浏览器的css3渐变代码:linear-gradient(top,red,blue); 但是得加前缀,-webkit–moz–ms- -o-以及为

蚊子1899的前端之路 2919

CSS3新vw, vh单位

From: http://www.zhangxinxu.com/wordpress/2012/09/new-viewport-relative-units-vw-vh-vm-vmin/ CSS3新vw, vh单位与纯CSS定位的弹框屏幕居中效果实例页面 CSS3新vw, vh单位与纯CSS定位的弹框屏幕居中效果实例页面 /* 既然vw, vh是视区相

服务好姐qa 2万+

IE8linter实战教程:5个常见IE8兼容性问题解决方案

在Web开发的世界里,Internet Explorer 8IE8)兼容性检测工具IE8linter是前端开发者的得力助手。这个简单而强大的工具能够快速扫描网站,识别出可能影响IE8兼容性的问题,并提供实用的修复建议。无论你是维护老项目的开发者,还是需要确保网站能在IE8上正常运行的工程师,IE8linter都能为你节省大量调试时间。 [![IE8兼容性检测工具](https://raw.gi

gitblog_00461的博客 746

解决IE8中常见兼容性问题解决方案

在网站开发中不免因为各种兼容问题苦恼,针对IE8兼容性视图问题,其实IE给出了解决方案去解决IE8的兼容问题  (一) http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml>;(可以不写) <meta http-equiv=“X-UA-Compatible” content=“IE=8″>(尽量写在

mjf853912229的博客 3827

CSS HACK:IE6、IE7、IE8、Firefox兼容性问题解决方案

CSS HACK:IE6、IE7、IE8、Firefox兼容性问题解决方案

asdfgh0077的博客 115

IE8兼容性问题解决方案

前几天,面试到Ie8的一些兼容问题,傻眼了,回想自己做了将近2年的移动端项目,ie兼容似乎没怎么做过。所以私下便开始找找ie兼容的视频或者文章学习,唉,还是不买书了,家里那么多书,都没看过呢,好了,开始发一波福利: 一、HTML5标签兼容方案:html5shiv.js GitHub地址:https://github.com/aFarkas/html5shiv/ IE8支持HTML5...

weixin_30484739的博客 254

DOM2级事件在IE6 7 8下的兼容性问题解决方案

对于万恶的IE6 7 8 对于DOM2级事件的处理存在很多兼容性问题(以下所说的IE均为 IE6 7 8) 1.在IE下的2级事件绑定使用的是attachEvent()这个方法 2.在IE下给一个事件重复绑定相同的方法,在触发的时候回重复的执行多次 3.在IE下同一个事件绑定的方法超过10个,在触发时 执行的顺序就会变成乱序 4.在IE下给事件绑定的方法里面的this指向的不是要绑定事

xiaoTuiMao的博客 929

AngularJs在IE6~7,及IE8特定版本下的兼容性问题解决方案

AngularJs在IE8之前版本中,会出现{{}}无法解析的现象,先记录解决方法。 1、添加html5shiv.js和json2.js 2、在html或body节加: ng-app="myapp"  id="ng-app" class="ng-app:myapp"> 源引:http://blog.csdn.net/baif911/article/details/4252

巴黎的妖 2703

ie8兼容性问题background-size解决方案(sass编写)

background-size是css3里面的属性,ie8不识别,我在项目里有遇到设置背景铺满的,就是background-size:cover;网上的方法很多,实用过后觉得这个方法不错,直接在样式后面加上,filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(enabled=Enabled, sizingMethod=scale ,...

feizhong_web的博客 993
上一篇: 外观模式和适配器模式
下一篇: 小程序快速开发(使用Wepy框架)
王冬阳
博客等级 码龄11年 36粉丝 41原创
评论 3
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值