2010-01-16 183 views
4

我正在尋找一種獲得文本陰影的方式,它看起來像css3文字陰影,但是可以與IE,Firefox,Opera,Safari等一起使用......我找到的解決方案搞砸了或在IE中看起來不一致。由於跨瀏覽器文字陰影

http://www.workingwith.me.uk/articles/css/cross-browser-drop-shadows

.shadow { 
    height: 1em; 
    filter: Shadow(Color=#666666, 
      Direction=135, 
      Strength=5); 
} 

這對我不工作...在IE

ul.dropdown a.selected-l { 
    background-image: url('Images/Navigation/Left_round/hoverL.png'); 
    height: 50px; 
    width: 130px; 
    font-family: Cambria, Cochin, Georgia, Times, "Times New Roman", serif; 
    font-size: large; 
    color: #FFFFFF; 
    text-align: center; 
    text-decoration: none; 
    line-height: 50px; 
    vertical-align: middle; 

/* pretty browsers*/ 
     text-shadow:#000 0px 0px 5px; 
     /* ugly ie */ 
     zoom:1;/*force hasLayout*/ 
     position:relative;/*for absolute position of child element*/ 

; 


} 

ul.dropdown a.selected-l span { 

    position:absolute; 
     left:-7px;top:-7px; /* strength + pixelradius */ 
     z-index:-1;/* force under the normal text */ 
     /* the magic: filters */ 
     filter: 
      progid:DXImageTransform.Microsoft.Glow(Color=#eeeeee,Strength=2) 
      progid:DXImageTransform.Microsoft.blur(pixelradius=5, enabled='true') 
     ; 
     zoom:1;/*force hasLayout*/ 

} 
+0

到目前爲止您找到的解決方案是什麼?小心分享? – 2010-01-16 01:22:28

+0

請指定一個IE範圍。如果只支持最新的IE,該怎麼辦? – 2010-01-16 01:33:04

回答

5

我的建議將是使用CSS3 text-shadow(基於WebKit的瀏覽器,FF3.5,歌劇9.5 )。

對於IE瀏覽器,使用IE條件註釋來實現下列條件之一:

一些相關文章:

+0

它並沒有真正解決,但無論如何感謝 – jmasterx 2010-01-16 04:19:10

+0

是的,我想不出一個理想的解決方案。 – 2010-01-16 05:04:04

0

退房這個職位,我寫了一篇關於這個問題:

Crossbrowser Text Shadow with Jquery

也許這是更合你的胃口?它IS使用jQuery雖然並不是一個真正有效的方式..但無論如何這是一些東西。 :)