在web页面的ui表现中,投影效果可以说是非常常见的一种表现效果了。
对于目前对CSS3支持如狗屎的孤芳自赏的IE浏览器怎么办呢?box-shadow属性对于IE浏览器就像是圣诞树上的彩灯——装饰而已。
好在IE浏览器有个IE shadow滤镜,是IE浏览器私有的一个东西,可以模拟还凑合的盒阴影效果,使用类似于下面的代码:
.shadow {
-moz-box-shadow: 3px 3px 4px #000;
-webkit-box-shadow: 3px 3px 4px #000;
box-shadow: 3px 3px 4px #000;
/* For IE 8 */
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
/* For IE 5.5 - 7 */
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
}
浏览器支持情况
Firefox 3.5+
Safari 3+
Google Chrome
Opera 10.50
Internet Explorer 5.5
分享到:
相关推荐
一、前言 我之前曾写过一篇关于实现跨浏览器实现box-shadow效果的文章——“CSS实现跨浏览器兼容性的盒阴影效果”,本文虽然题目类似,但是核心部分是有差异的。前面的文章虽然实现IE下的盒阴影效果也是使用的滤镜,...
三、浏览器兼容性 在使用 CSS3 的阴影效果时,需要注意浏览器的兼容性问题。在前面的介绍中,我们已经声明,并不是所有的浏览器都支持 CSS3。最好的支持 CSS3 阴影效果的浏览器是 Safari,也就是说,我们现在只需要...
圆角、阴影、透明的实现方法有很多,之前的获取比较复杂,用CSS3就方便很多了,而且对浏览器的支持性也比较好,下面简单为大家介绍下
浏览器兼容性:不同的浏览器兼容性不同,mozilla内核的浏览器写法如下(但新版本的火狐浏览器已经不需要再添加):-moz-box-shadow:阴影类型 X水平偏移(可取正负值) Y垂直偏移(可取正负值) 阴影大小 阴影扩展 阴
9.jquery仿google首页图标动画菜单效果实现模拟鼠标动画菜单的代码 10.jquery仿卓越亚马逊网鼠标移到按钮弹出菜单的效果代码 11.jquery浮动变化的个性菜单插件floatmenu下载 12.jQuery黑色风格仿Flash版下滑...
107. 推荐jQuery模拟Windows视窗的效果实现相册图片拖动特效插件 108. 推荐jQuery网站首页三幅banner切换大图广告自动滚动代码下载 109. 推荐jQuery购物类产品图片放大插件jqzoom v2.0下载 110. 推荐实用jquery...
Dropshadow滤镜可以生成一个阴影效果,感觉是文字在背景上浮动着。我们可以通过设置offx、offy、color等属性来控制阴影的位置、大小和颜色。 在我们提供的代码中,我们使用了四个Dropshadow滤镜来生成文字描边效果...
兼容性列表涉及浏览器及版本众多; 草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去,而我们的手册从基础语法到示例制作,都是根据W3C工作草案...
13.2 浏览器兼容性 292 13.2.1 CSS hack技术 292 13.2.2 盒模型 298 13.2.3 浮动模型 303 13.2.4 IE 3px Bug 306 13.2.5 IE文字溢出现象 307 13.2.6 IE6 Peekaboo Bug(捉迷藏) 309 13.2.7 IE6 Guillotine Bug...
兼容性列表涉及浏览器及版本众多; 草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去,而我们的手册从基础语法到示例制作,都是根据W3C工作草案...
兼容性列表涉及浏览器及版本众多; 草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去,而我们的手册从基础语法到示例制作,都是根据W3C工作草案...
你或许会不以为然,可是我想告诉你的是即使将来CSS3圆角实现全浏览器兼容,但在当下图片圆角依旧是主流,丰富的图片效果(渐变、阴影、透明度、圆角、浏览器兼容、开发维护效率)这些是用代码实现远远不可比拟的。...
兼容性列表涉及浏览器及版本众多; 草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去。 而这本的手册从基础语法到示例制作,都是根据W3C工作...
兼容性列表涉及浏览器及版本众多; 草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去,而我们的手册从基础语法到示例制作,都是根据W3C工作草案...
3.兼容性列表涉及浏览器及版本众多; 4.草案中的Grid布局被业界同仁普遍认为比“天书”还难… CSS3 还是草案,中文资料少之又少,基本上都是一篇内容转来转去,而我们的手册从基础语法到示例制作,都是根据W3C工作...
备受期待的 CSS 3 新功能 圆角、多背景、@font-face 用户自定义字体、动画与渐变、渐变色、盒阴影、RGBa - 加入透明色、文字阴影等等 CSS3 的出现,让代码更简洁、页面结构更合理,性能和效果得到兼顾。
63. [荐]jquery仿flash漂亮横向图片滚动效果完整版(兼容性非常好) 64. [荐]jQuery焦点图幻灯切换插件Tab选项卡(soChange 1.4)下载 65. 一款jQuery仿flash放大图片的相册插件 66. 一款jQuery仿苹果mac os系统经典...
要使用标准的CSS3实现某元素的投影效果,有两个套路,第一个就是使用常见的box-shadow, 第二个就是使用CSS3的filter阴影滤镜drop-shadow,那这两个阴影实现有什么具体的差异呢? 一、兼容性不一 CSS3 box-shadow从...
大部分的css效果是可以 2.优先级 1.浏览器默认样式 2.内部样式和外部样式(就近原则) 3.内联样式 4.!important; 绝对优先使用() 格式 p{ color:red !important; } 2.css选择器 1.选择器的作用 规范...