IE兼容性
1、ie兼容css3 border-radius、box-shadow、text-shadow的方法
一、ie兼容border-radius、box-shadow、text-shadow
1、下载ie-css3.htc
2、css
box {
-moz-border-radius: 15px; /* Firefox */
-webkit-border-radius: 15px; /* Safari 和 Chrome */
border-radius: 15px; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */ -moz-box-shadow: 10px 10px 20px #000; /* Firefox */
-webkit-box-shadow: 10px 10px 20px #000; /* Safari 和 Chrome */
box-shadow: 10px 10px 20px #000; /* Opera 10.5+, 以及使用了IE-CSS3的IE浏览器 */ behavior: url(ie-css3.htc); /* 通知IE浏览器调用脚本作用于'box'类 */
}
二、问题
1、只能同时4角圆角,不能单独设置;
2、div上可以正常使用,测试text文本框,会出现异常;
3、CSS文件要和页面在同一目录下,否则无效
4、当前元素一定要有定位属性,像是position:relative或是position:absolute属性。
5、z-index值一定要比周围元素的要高,否则……只能说抱歉了~~
三、支持的样式及说明
参见表:
样式 | 生效 | 无效 |
border-radius | 为元素四个角设置圆角属性元素边框 | 只设置一个圆角 |
box-shadow | 模糊大小参数 偏移值 | 不支持除了黑色(#fff)以外的其它颜色 |
text-shadow | 模糊大小参数 偏移值 颜色值 | IE下的表现与Firefox/Safari/Chrome有一点点的差异 |
二 、ie兼容性问题及解决方法
1、在IE6下,块元素有浮动和横向margin值,横向的margin会变成两倍。和margin方向有关系。
7、IE6下父级元素包不住子级的相对定位
<!--[if IE]>
这段文字只在IE浏览器显示
<![endif]-->
<!--[if IE 6]>
这段文字只在IE6浏览器显示
<![endif]-->
<!--[if lt IE 8]
这段文字只在IE8浏览器以下显示
<![endif]-->
<!--[if gte IE 6]>
这段文字只在IE6以上(包括)版本IE浏览器显示
<![endif]-->
<!--[if ! IE 8]>
这段文字在非IE8浏览器显示
<![endif]-->
<!--[if !IE]>
这段文字只在非IE浏览器显示
<![endif]-->
2、属性前缀法:
标准模式下:
#selector{
-color: red; /* 减号和下划线是IE6专有的hack */
color:blue\9; /* \9 IE6-IE10都生效 */
color: pink\0; /* \0 IE8-IE11生效 */
color: green\9\0; /* \9\0 IE9和IE10生效 */
*color: yellow; /* [.*+<>] IE6-IE7生效 */
}
3、选择器前缀法:
*+html selector{color:blue;} /* *+html前缀只支持IE7 */
IE兼容性的更多相关文章
- 前端css兼容性与易混淆的点
一.常用的骨灰级清除浮动 .clearfix:after { content: "."; display: block; height:; clear: both; visibil ...
- SQL Server2008R2 在windows8上安装,出现“兼容性”和 “执行未经授权的操作”的错误!
本人是windows8.1的操作系统,亲测安装成功 解决方法如下: 1.卸载干净sql Server2008r2,包括注册表内容,删除c盘下的安装路径! 2.关闭防火墙(这步很重要) 3.断开网络连接 ...
- [转载]强制不使用“兼容性视图”的HTML代码
在IE8浏览器以后版本,都有一个"兼容性视图",让不少新技术无法使用.那么如何禁止浏览器自动选择"兼容性视图",强制IE以最高级别的可用模式显示内容呢?下面就介 ...
- 企业IT管理员IE11升级指南【16】—— 使用Compat Inspector快速定位IE兼容性问题
企业IT管理员IE11升级指南 系列: [1]—— Internet Explorer 11增强保护模式 (EPM) 介绍 [2]—— Internet Explorer 11 对Adobe Flas ...
- 浅谈WebService的版本兼容性设计
在现在大型的项目或者软件开发中,一般都会有很多种终端, PC端比如Winform.WebForm,移动端,比如各种Native客户端(iOS, Android, WP),Html5等,我们要满足以上所 ...
- position:sticky的兼容性尝试
开篇 笔者刚刚结束淘宝的工作,现在加入了一家有青春活力的垂直电商公司,正对着阿里巴巴的西溪园区,最近一直在熟悉新的工作环境和规范,因此博客有好些时间没有更新了,在此抱歉! 在忙碌完公司的发布系统之后, ...
- 常用原生JS方法总结(兼容性写法)
经常会用到原生JS来写前端...但是原生JS的一些方法在适应各个浏览器的时候写法有的也不怎么一样的... 今天下班有点累... 就来总结一下简单的东西吧…… 备注:一下的方法都是包裹在一个EventU ...
- Atitit Atitit.软件兼容性原理----------API兼容 Qa7
Atitit Atitit.软件兼容性原理----------API兼容 Qa7 1. 兼容性的重要性与反面教材1 2. 提升兼容性的原则2 2.1. What 与how 分离2 2.2. 老人老办法 ...
- Atitit.兼具兼容性和扩展性的配置方案attilax总结
Atitit.兼具兼容性和扩展性的配置方案attilax总结 文件配置法1 Jdbc多数据源文件配置发1 Bat文件配置法1 改进的文件配置法(采用类似i18n技术) 推荐1 使用自动化pc_id的方 ...
- Atitit.软件架构高扩展性and兼容性原理与概论实践attilax总结
Atitit.软件架构高扩展性and兼容性原理与概论实践attilax总结 1. 什么是可扩展的应用程序?1 2. 松耦合(ioc)2 3. 接口的思考 2 4. 单一用途&模块化,小粒度化2 ...
随机推荐
- JavaWeb学习笔记——Ajax
- JavaScript学习笔记——事件
javascript事件基础和事件绑定 一.事件驱动 1.事件 javascript侦测到的用户的操作或是页面的一些行为(怎么发生的) 2.事件源 引发事件的元素.(发生在谁的身上)3.事件处理程序 ...
- JavaScript学习笔记——DOM_对document对象的内容、属性、样式的操作
javascript-对文档对象的内容.属性.样式的操作 一.操作内容 1. innerHTML 用来设置或获取对象起始和结束标签内的内容(识别html标签) 2. innerText 用来设置或获取 ...
- Game Programming Pattern
http://gameprogrammingpatterns.com/contents.html
- OpenGL Code Resources
https://www.opengl.org/wiki/Code_Resources http://ogldev.atspace.co.uk/
- js正则,电话,邮箱
1. <script type="text/javascript"> var str="Is this all th05777-89856825ere is5 ...
- JabRef 文献管理软件
JabRef 文献管理软件简明教程 大多只有使用LaTeX撰写科技论文的研究人员才能完全领略到JabRef的妙不可言,但随着对Word写作平台上BibTeX4Word插件的开发和便利应用,使用Word ...
- live555在Raspberry Pi上的点播/直播
1.live555在Raspberry Pi上的点播 live555MediaServer这个实例是个简单的服务器,支持多媒体点播,直接在Raspberry Pi上编译运行,或者通过交叉编译出ARM核 ...
- tar: 由于前次错误,将以上次的错误状态退出
1.安装cmake的源码包,出现以下错误提示: # tar -zxvf cmake-3.2.2.tar.gz cmake-/Source/cmCommandArgumentParser.cxx tar ...
- jexus jws 安装
cd /tmp wget linuxdot.net/down/jexus--x64.tar.gz tar -zxvf jexus--x64.tar.gz mv jexus /usr rm -rf /t ...