如何讓IE瀏覽器支持CSS3圓角屬性

這篇文章主要為大家展示了“如何讓IE瀏覽器支持CSS3圓角屬性”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“如何讓IE瀏覽器支持CSS3圓角屬性”這篇文章吧。

羅湖ssl適用于網(wǎng)站、小程序/APP、API接口等需要進行數(shù)據(jù)傳輸應用場景，ssl證書未來市場廣闊！成為創(chuàng)新互聯(lián)公司的ssl證書銷售渠道，可以享受市場價格4-6折優(yōu)惠！如果有意向歡迎電話聯(lián)系或者加微信：18982081108（備注：SSL證書合作）期待與您的合作！

1、下載一個壓縮包，里面有一個微軟的腳本文件（11KB）和一個用來測試服務器是否有正確的Content-Type的HTML文件：iecss3.rar；.htc文件是IE內核支持Web行為后用來描述此類行為的腳本文件。它們定義了一套方法和屬性，程序員幾乎可以把這些方法和屬性應用到HTML頁面上的任何元素上去。Web 行為是非常偉大的因為它們允許程序員把自定義的功能“連接”到現(xiàn)有的元素和控件，而不是必須讓用戶下載二進制文件（例如ActiveX 控件）來完成這個功能。

解壓后，打開test.html，如果顯示效果是圓角，則可以繼續(xù)。

使用演示：

.main{

border: 2px solid #C0C0C0;

-moz-border-radius: 10px;

-webkit-border-radius: 10px;

border-radius: 10px;

position:relative;

z-index:2;

behavior: url(此處為ie-css3.htc文件的絕對路徑);

}

Webkit內核的瀏覽器支持“-webkit-border-radius: 10px;”屬性（10px是圓角半徑），可以直接解析出圓角；Firefox瀏覽器支持“-moz-border-radius: 10px;”屬性，也是可以直接解析出圓角；IE系瀏覽器則需要加上“border-radius: 15px;”的屬性。

注意事項：

1、behavior的url里一定要填寫ie-css3.htc的絕對路徑，因為 IE瀏覽器找該文件是相對當前html文件路徑來找的，所以對于Wordpress等動態(tài)程序生成的頁面一定要填寫絕對路徑。

2、一定要有定位屬性：position:relative;

3、因為在IE瀏覽器下這些CSS3效果的實現(xiàn)是要借助于VML，由VML繪制圓角或是投影效果，所以還需要一個z-index屬性。z-index屬性最好設置得比較大，如2。

4、如果在IE瀏覽器下某些模塊無法用此渲染，可以試著絕對定位相應的層，即加上“ width: 400px; height:400px;”屬性。

5、radius屬性的10px是圓角半徑，還可以給兩個值如“border-radius: 10px 5px;”，這樣則左上角與右下角半徑為10px，右上角與左下角半徑為5px。也可以賦4個值，為“上  右  下  左”。

以上是“如何讓IE瀏覽器支持CSS3圓角屬性”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注創(chuàng)新互聯(lián)行業(yè)資訊頻道！

當前名稱：如何讓IE瀏覽器支持CSS3圓角屬性
網(wǎng)站網(wǎng)址：http://muchs.cn/article48/pisdep.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、移動網(wǎng)站建設、軟件開發(fā)、網(wǎng)站維護、品牌網(wǎng)站制作、Google

廣告

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)