IE兼容CSS3圆角border-radius，box-shadow，text-shadow的方法

1.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'类 */
}

2.问题：

一、只能同时4角圆角，不能单独设置；

二、div上可以正常使用，测试text文本框，会出现异常；

三、CSS文件要和页面在同一目录下，否则无效

四、当前元素一定要有定位属性，像是position:relative或是position:absolute属性。

五、z-index值一定要比周围元素的要高，否则……只能说抱歉了~~

3.支持的样式及状态说明

参见下表：

样式	生效	无效
border-radius	为元素四个角设置圆角属性元素边框	只设置一个角落的圆角属性
box-shadow	模糊大小参数偏移值	不支持除了黑色(#000)以外的其他颜色
text-shadow	模糊大小参数偏移值颜色值	IE下的表现与Firefox/Safari/Chrome有一点点的差异，原因不详

转载于:https://www.cnblogs.com/qiandanwu/p/5768192.html

IE兼容CSS3圆角border-radius，box-shadow，text-shadow的方法相关推荐

IE6,7,8中兼容css3圆角问题
圆角效果使人感觉网页更加协调美观,ie9.Opera 10.5.Safari 5.Chrome 4和Firefox 4及其以上版本都添加了对css3的支持,这让我们领略到了css3的强悍. 传统的圆角 ...
html圆角兼容jq,IE兼容css3圆角的htc解决方法
现在css3的border-radius属性可以很方便的实现圆角功能,对网站前台人员无疑是一件喜事,但悲剧的是IE6/7/8并不支持,让我们弃新技术不用,是不可能的,因此找到了一种解决的办法--- I ...
css阴影设置透明度,css3圆角阴影透明度
css3圆角阴影透明度 .box{ width: 200px; height: 200px; border: 2px solid #000; background-color: gold; mar ...
兼容所有浏览器的CSS3圆角效果
解决CSS3圆角兼容所有浏览器的方法.本文提到了一种很不错的实现跨浏览器圆角的解决方案. 前一段时间,我经常收到一个关于如何在IE浏览器中使用CSS3的border-radius属性实现圆角HTML元 ...
如何使用CSS3 Border Radius属性
With CSS3, you can give any element "rounded corners" by using the border-radius property. ...
彻底搞明白：CSS3圆角使用
引言 web开发中使用css对页面进行排版布局,CSS3是层叠样式表(Cascading StyleSheet)语言的最新版本,它的一大优点就是支持圆角.本文根据实际项目开发经验,对border-ra ...
文字在阴影层上面 css,CSS3中p-tag上的双重文字阴影(Double text shadow on p-tag in CSS3)...
CSS3中p-tag上的双重文字阴影(Double text shadow on p-tag in CSS3) 是否可以使用CSS3在一个p-tag上应用两个文字阴影? 我想用1像素边框创建一个非常浅 ...
CSS3圆角-透明操作-动画效果
CSS3 一.CSS3圆角二.rgba(新的颜色值表示法) 三.transition动画四.transform变换五.animation动画 1.解释 2.风车旋转的实例 3.登录中的loadi ...
css3圆角360度转动画,target，框架集，css3过渡动画，css3圆角-阴影-透明度，运动曲线，图片文字遮罩，变形...
target 模拟后台服务器框架集 frameset和body不合,所以如果用frameset就不能有body标签利用框架可以把浏览器窗口划分为若干个区域,每个区域就是一个框架,在其中分别显示不 ...

IE兼容CSS3圆角border-radius，box-shadow，text-shadow的方法

IE兼容CSS3圆角border-radius，box-shadow，text-shadow的方法相关推荐

最新文章

热门文章