IE下模擬css3中的box-shadow(陰影)效果代碼
發(fā)布時(shí)間：2013-09-11 17:35:19 作者：佚名 
我要評(píng)論
我要評(píng)論在ie下模擬css3中的box-shadow（陰影）可以使用ie的Shadow（陰影）濾鏡來(lái)實(shí)現(xiàn)，需要注意的是該濾鏡必須配合background屬性一起使用，否則該濾鏡失效
在ie下模擬css3中的box-shadow（陰影）可以使用ie的Shadow（陰影）濾鏡
基本語(yǔ)法：filter: progid:DXImageTransform.Microsoft.Shadow(color=’顏色值’, Direction=陰影角度（數(shù)值）, Strength=陰影半徑（數(shù)值）);
注意：該濾鏡必須配合background屬性一起使用，否則該濾鏡失效。
IE下模擬css3中的box-shadow（陰影）代碼：
.box-shadow{
filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=5);/*for ie6,7,8*/
background-color: #eee;
-moz-box-shadow:2px 2px 5px #969696;/*firefox*/
-webkit-box-shadow:2px 2px 5px #969696;/*webkit*/
box-shadow:2px 2px 5px #969696;/*opera或ie9*/
}
演示地址：http://www.css88.com/demo/box-shadow/
基本語(yǔ)法：filter: progid:DXImageTransform.Microsoft.Shadow(color=’顏色值’, Direction=陰影角度（數(shù)值）, Strength=陰影半徑（數(shù)值）);
注意：該濾鏡必須配合background屬性一起使用，否則該濾鏡失效。
IE下模擬css3中的box-shadow（陰影）代碼：
復(fù)制代碼
代碼如下:.box-shadow{
filter: progid:DXImageTransform.Microsoft.Shadow(color='#969696', Direction=135, Strength=5);/*for ie6,7,8*/
background-color: #eee;
-moz-box-shadow:2px 2px 5px #969696;/*firefox*/
-webkit-box-shadow:2px 2px 5px #969696;/*webkit*/
box-shadow:2px 2px 5px #969696;/*opera或ie9*/
}
演示地址：http://www.css88.com/demo/box-shadow/
相關(guān)文章
css3 box-shadow陰影(外陰影與外發(fā)光)圖示講解
這篇文章主要介紹了css3 box-shadow陰影(外陰影與外發(fā)光)，通過(guò)五個(gè)測(cè)試通過(guò)圖片展示了陰影的不同位置不同效果,需要的朋友可以參考下2017-08-11詳解CSS3陰影 box-shadow的使用和技巧總結(jié)
這篇文章主要介紹了詳解CSS3陰影 box-shadow的使用和技巧總結(jié) ,具有一定的參考價(jià)值，有需要的可以了解一下。2016-12-03- 下面小編就為大家?guī)?lái)一篇關(guān)于CSS3文本陰影text-shadow屬性詳解。小編覺(jué)得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧，祝大家游戲愉快哦2016-08-08
詳解CSS3的box-shadow屬性制作邊框陰影效果的方法
這篇文章主要介紹了CSS3的box-shadow屬性制作邊框陰影效果的方法,box-shadow屬性還是十分強(qiáng)大的,能設(shè)定陰影的水平或垂直位置,以及陰影的顏色和尺寸等,需要的朋友可以參考下2016-05-10CSS3實(shí)現(xiàn)千變?nèi)f化的文字陰影text-shadow效果設(shè)計(jì)
這篇文章主要介紹了CSS3實(shí)現(xiàn)千變?nèi)f化的文字陰影text-shadow效果設(shè)計(jì)的相關(guān)資料，感興趣的小伙伴們可以參考一下2016-04-26CSS3 text-shadow實(shí)現(xiàn)文字陰影效果
這篇文章主要介紹了CSS3 text-shadow實(shí)現(xiàn)文字陰影效果的方法，豐富文字排版布局美化效果，感興趣的小伙伴們可以參考一下2016-02-24- 最近在整理學(xué)習(xí)CSS3的一些小知識(shí)，現(xiàn)在已經(jīng)整理了CSS3選擇器，CSS3圓角和CSS3元素陰影屬性的使用方法了。今天為大家整理一下CSS3中的字體陰影——text-shadow的使用方法。2016-01-08
- 這篇文章主要介紹了舉例詳解CSS中的text-shadow文字陰影效果使用,text-shadow的運(yùn)用是CSS入門(mén)學(xué)習(xí)中的基礎(chǔ)知識(shí),需要的朋友可以參考下2015-08-19
css實(shí)現(xiàn)跨瀏覽器的box-shadow盒陰影效果告別圖片實(shí)現(xiàn)類(lèi)似效果(2)
前面的文章雖然實(shí)現(xiàn)IE下的盒陰影效果也是使用的濾鏡，但是使用的是shadow濾鏡，這種濾鏡的效果很牽強(qiáng)，效果過(guò)渡不自然.而本文實(shí)現(xiàn)的IE下的盒陰影效果就相對(duì)非常自然，而且2013-01-08- 前段時(shí)間整理了CSS3中的漸變Gradient、透明度RGBA、邊框圓角box-radius三個(gè)新屬性的使用方法，這幾次繼續(xù)整理了有關(guān)于CSS3的text-shadow的使用方法,需要了解的朋友可以詳細(xì)2012-12-25
