CSS3圓角盒和暗影問題

HTML代碼：

<div class="fotter" > 
&nbsp;&nbsp;&nbsp;&nbsp;Copyright&copy;2012       
<span style=" float:right;"> 
<strong>Privacy Policy</strong>&nbsp;&nbsp;     
<strong>Contact Us</strong>&nbsp;&nbsp;     
<strong>Edumemn</strong>&nbsp;&nbsp; 
</span> 
</div>

和

CSS代碼：

.fotter{ 
padding:10px 0 5px 0; 
margin:0 auto; margin-bottom:10px; 
background-image:url(../img/fotter.jpg); 
background-repeat:repeat-x; 
height:30px; width:1037px; 
border:0; 
outline:0; 
float:left; font-family: Verdana, Geneva, sans-serif; font-size:12px; 
border-bottom-right-radius:5px; 
border-bottom-left-radius:5px; 
box-shadow: 0px 1px 2px #000; 
-webkit-box-shadow: -1px 0px 2px #000; 
-moz-box-shadow: 0px 5px 2px #000; 
}

這是我的網站鏈接..http：//nerflek.net/PSD TO HTML/

我的問題是..在Firefox它是在頁腳部分顯示帶陰影的圓角框。但在Internet Explorer 8中不顯示任何陰影或圓角框。

有沒有人幫我解決這個問題。
在此先感謝:-)

來源

2012-09-26 Kanta

IE8是舊的，不支持它。我不會花太多時間修復它。讓它在I8上看起來「夠好」，並等待每個人都升級。 – GolezTrol

原因是，border-radius isn't supported by IE8。

對於這個舊的瀏覽器來說，一個「解決方案」是使用角落圖像，或者更合理地說，讓未升級的用戶有方形角落。

來源

2012-09-26 17:18:38

稍微好於圓角圖像IE修復 - http://css3pie.com/ –

css3pie會給很多副作用，請注意 – Giona

right @dystroy。 – Kanta

邊境-radius不支持IE8，繞了一個辦法是使用插件，這是一個簡單而有效的， http://jquery.malsup.com/corner/

來源

2012-09-26 17:21:08 Rahul

以及我正在檢查它.. – Kanta

還有另一個輕量級插件，您可以考慮http://www.htmlremix.com/css/curved-corner-border-radius-cross-browser – Rahul

這樣做將是對即目標CSS的另一種方式。

你可以像

<head> 
<link rel="stylesheet" type="text/css" href="normal.css" /> 
<!--[if lte IE 8]> <link rel="stylesheet" type="text/css" href="ie.css" /> <![endif]--> 
</head>

添加它，在你ie.css您可以添加背景圖片。

ie.css

div#samepagecontainer { 
.. 
.. 
background : #aaa url(/path/to/image.file) no-repeat top left; 
.. 
}

來源

2012-09-26 17:41:44 Rahul

CSS3圓角盒和暗影問題

回答

相關問題