IE浏览器兼容background-size
background-size是CSS3新增的属性,IE8以下不支持,通过滤镜实现background-size效果
background-size:contain; // 缩小图片来适应元素的尺寸(保持像素的长宽比);
background-size :cover; // 扩展图片来填满元素(保持像素的长宽比);
background-size :100px 100px; // 调整图片到指定大小;
background-size :50% 100%; // 调整图片到指定大小,百分比相对于包含元素的尺寸。
浏览器兼容:
IE 和遨游不支持;
Firefox 添加私有属性 -moz-background-size 支持;
Safari 和 Chrome 添加私有属性 -webkit-background-size 支持;
Opera 不支持 background-size 属性,添加其私有属性 -o-background-size 也不支持。
通过浏览器私有属性:
- background:#00ff00 url(img.jpg) no-repeat;
- -moz-background-size:60% 80%;
- -webkit-background-size:60% 80%;
- -o-background-size:60% 80%;}
- background-size:60% 80%;
IE专属实现方式:
- background-size:cover;
- background-repeat:no-repeat;
- background-image:url(../../../easimages/core/claim/ht_btn_bg3.png);
- filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='../../../easimages/core/claim/ht_btn_bg3.png',sizingMethod='scale');
注意: 路径要是一样的并且是绝对路径
IE浏览器兼容background-size的更多相关文章
- CSS在不同浏览器兼容问题,margin偏移/offset溢出等
margin在垂直取值时取最大值 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "h ...
- video视频播放以及主流浏览器兼容
直接看代码吧! <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> < ...
- CSS3与页面布局学习总结(八)——浏览器兼容与前端性能优化
一.浏览器兼容 1.1.概要 世界上没有任何一个浏览器是一样的,同样的代码在不一样的浏览器上运行就存在兼容性问题.不同浏览器其内核亦不尽相同,相同内核的版本不同,相同版本的内核浏览器品牌不一样,各种运 ...
- CSS-各种cs样式之浏览器兼容处理方式汇总大全(更新中...)
页面模板 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 ...
- 浅谈CSS hack(浏览器兼容)
今天简单写一点关于浏览器兼容的处理方法,虽然百度上已经有很多,但是我还是要写! 先看一个图 这个图描述了2016年1月至8月网民们所使用的浏览器市场份额(来源:http://tongji.baidu. ...
- jQuery-1.9.1源码分析系列(七) 钩子(hooks)机制及浏览器兼容
处理浏览器兼容问题实际上不是jQuery的精髓,毕竟让技术员想方设法取弥补浏览器的过错从而使得代码乱七八糟不是个好事.一些特殊情况的处理,完全实在浪费浏览器的性能:突兀的兼容解决使得的代码看起来既不美 ...
- 关于浏览器兼容问题及hack写法
浏览器的兼容问题 1.浏览器内核: Mozilla Firefox ( Gecko ) Internet Explorer ( Trident ) Opera ( Presto ) Safari ( ...
- 转:【总结】浏览器CSS Hacks汇总,浏览器兼容方式CSS Hacks
[总结]浏览器CSS Hacks汇总 浏览器兼容可以说是前端开发所要面对的第一个挑战,目前我的电脑上已经安装了6种浏览器(基于IE内核的不算,如Maxthon等). CSS hacks利用浏览器的 ...
- 【转】Web前端浏览器兼容初探
原文地址:http://blog.jobbole.com/38638/ 前言 浏览器兼容是前端开发人员必须掌握的一个技能,但是初入前端的同学或者其他后台web开发同学往往容易选择忽略,而形成两个极端: ...
- CSS背景图拉伸自适应尺寸,全浏览器兼容
突然有人问我这个问题,说网上CSS filter的方法在非IE浏览器下不奏效.思考之后,问题之外让我感慨万千啊,很多我们所谓的难题,都会随着时代的发展迎刃而解,或被新的问题所取代. 当CSS背景图片拉 ...
随机推荐
- Redis GEO 特性在 LBS 中的应用总结
什么是LBS LBS(Location Based Service),基于位置的服务. Redis和GEO Redis 是最热门的 nosql 数据库之一,它的最大特点就是快.所以在 LBS 这种需要 ...
- vue render函数使用jsx语法 可以使用v-model语法 vuex实现数据持久化
render函数使用jsx语法: 安装插件 transform-vue-jsx 可以使用v-model语法安装插件 jsx-v-model .babelrc文件配置: vuex实现数据持久化 安装插 ...
- python -m json.tool 中文乱码 Format JSON with python
现在以 json 为数据传输格式的 RESTful 接口非常流行.为调试这样的接口,一个常用的办法是使用 curl 命令: curl http://somehost.com/some-restful- ...
- MSSQL 调用 .net 代码
http://www.cnblogs.com/laozhao8/p/3398681.html 在SQL Server中调用.NET程序集 需求是这样的,我在.net程序里操作数据时将一些字段数据加 ...
- GitHub---github入门
setup git --- create a repository-----fork a repository -- a pull request (be social)
- Asset Catalog Help (九)---Changing Image Set Names
Changing Image Set Names Use the Attributes inspector to edit a set’s name. 使用属性检查器(Attributes inspe ...
- ECharts使用问题
Echarts官网上给的例子,在最后有一个分号. 使用ajax请求,在eval()转化时出现错误,原因就是因为多了一个分号
- PYTHON实现DFS算法
class Vertice: def __init__(self,index): self.no = index self.color = 0 # 0:white 1 gray 2 black sel ...
- Swift3.0 键盘高度监听获取
方法:通过通知监听键盘的动态 1.键盘的动态有四种: public static let UIKeyboardWillShow: NSNotification.Name public static l ...
- laravel V层
V层 即视图层 也就是常用的html页面 但在laravel里后缀为php 视图层路径resources/views/视图名称.php