IE兼容CSS3圆角border-radius的方法(同时兼容box-shadow,text-shadow)
IE兼容CSS3圆角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'类 */
}
3.问题:
一、只能同时4角圆角,不能单独设置;
二、div上可以正常使用,测试text文本框,会出现异常;
三、CSS文件要和页面在同一目录下,否则无效
四、当前元素一定要有定位属性,像是position:relative或是position:absolute属性。
五、z-index值一定要比周围元素的要高,否则……只能说抱歉了~~
4.支持的样式及状态说明
参见下表:
| 样式 | 生效 | 无效 |
|---|---|---|
| border-radius | 为元素四个角设置圆角属性 元素边框 |
只设置一个角落的圆角属性 |
| box-shadow | 模糊大小参数 偏移值 |
不支持除了黑色(#000)以外的其他颜色 |
| text-shadow | 模糊大小参数 偏移值 颜色值 |
IE下的表现与Firefox/Safari/Chrome有一点点的差异,原因不详 |
IE兼容CSS3圆角border-radius的方法(同时兼容box-shadow,text-shadow)的更多相关文章
- IE兼容css3圆角的htc解决方法
IE兼容css教程3圆角的htc解决方法 现在css3的border-radius属性可以很方便的实现圆角功能,对网站前台人员无疑是一件喜事,但悲剧的是IE6/7/8并不支持,让我们弃新技术不用,是不 ...
- IE6下完美兼容css3圆角和阴影属性的htc插件PIE.htc
1.(推荐:)css插件PIE.htc,这个才是真正完美兼容css3的圆角和阴影属性在IE6环境下使用的效果,但要注意的是:下面的代码必须写在html文件的head标签内,否则无效(不能从外部引用下面 ...
- CSS3 圆角属性 border-radius和-webkit-border-radius使用
CSS3 圆角属性 border-radius 在 CSS3 中新增了一个 border-radius 边框半径属性,即大家常用的圆角效果.这使得制作圆角将不再麻烦,只需对所用对象加一个 border ...
- 兼容所有浏览器的CSS3圆角
兼容所有浏览器的CSS3圆角 解决CSS3圆角兼容所有浏览器的方法.本文提到了一种很不错的实现跨浏览器圆角的解决方案,但是说的不够全面,前端观察最近将整理更多更全面的资源给大家,敬请期待. ...
- border-radius 样式表CSS3圆角属性
border-radius 是CSS3圆角属性,用来实现DIV层的4个边框画成圆角. 一.语法: border-radius : none | <length>{1,4} [/ <l ...
- div+css兼容 ie6_ie7_ie8_ie9_ie10和FireFox_Chrome等浏览器方法
1.div的垂直居中问题 vertical-align:middle; 将行距增加到和整个DIV一样高 line-height:200px; 然后插入文字,就垂直居中了.缺点是要控制内容不要换行 ...
- IE6/7/8如何兼容CSS3属性
最近在工作中总是要求IE8兼容CSS3属性,在网上搜了搜主要是引入了一个htc文件(ie-css3.htc或者PIE.htc.个人认为这两个文件的作用差不多,具体差异值得探讨) 下载地址:https: ...
- 纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果
原文:纯代码利用CSS3 圆角边框和盒子阴影 制作 iphone 手机效果 大家好,我是小强老师. 今天我们看下CSS3最为简单的两个属性. css3给我们带来了很多视觉的感受和变化,以前的图片做的事 ...
- CSS3圆角圆边 支持IE6-IE8浏览器
CSS3圆角圆边样式,支持各大版本浏览器,包括支持IE6-IE9浏览器的圆边圆角. 本文我们主要是讲解如果用CSS 3样式表来实现圆角效果,值得注意的是,IE6/7/8这三个IE浏览器版本都不支持CS ...
随机推荐
- LruCache--远程图片获取与本地缓存
Class Overview A cache that holds strong references to a limited number of values. Each time a value ...
- HDU3333 Turing Tree 离线树状数组
题意:统计一段区间内不同的数的和 分析:排序查询区间,离线树状数组 #include <cstdio> #include <cmath> #include <cstrin ...
- Raspberry Pi3 ~ 安装samba服务
文章转载自此博文 1. sudo apt-get install samba 如果出现错误提示,则需要先执行sudo apt-get update,再重新执行sudo apt-get install ...
- Ubuntu 16.04 Mxnet CPU 版本安装
在安装前配置好更新源,基本要求就是速度越快越好: 1.安装Python apt-get install python 2.安装Git apt-get install git 3.安装依赖包 ...
- 线程局部变量ThreadLocal的原理及使用范围_1
线程局部变量ThreadLocal的原理及使用范围 使用原理 每个Thread中都有一个ThreadLocalMap成员, 该成员是ThreadLocal的内部类ThreadLocalMap类型.每使 ...
- PySpark操作HBase时设置scan参数
在用PySpark操作HBase时默认是scan操作,通常情况下我们希望加上rowkey指定范围,即只获取一部分数据参加运算.翻遍了spark的python相关文档,搜遍了google和stackov ...
- poj 1005 I Think I Need a Houseboat
#include <iostream> using namespace std; const double pi = 3.1415926535; int main() { ;; doubl ...
- 怎么利用C#中的 webclient 创建cookie
Cookies are not limited only to web browsers. any http-aware client that supports cookies can deal w ...
- C++11初始化列表
[C++11之初始化列表] 在C++03中,在严格遵守POD的定义和限制条件的结构及类型上可以使用初始化列表(initializer list),构想是结构或是数组能够依据成员在该结构内定义的顺序通过 ...
- codeforces 659A Round House
A. Round House time limit per test 1 second memory limit per test 256 megabytes input standard input ...