我想申請一個3px左上角&右上半徑邊框。CSS瀏覽器應用半徑邊框的安全方法?
如何在所有瀏覽器(例如IE,WebKit,Mozilla)上執行此操作?
如果瀏覽器不支持border-radius屬性,則默認爲無半徑(方形角)。
我想申請一個3px左上角&右上半徑邊框。CSS瀏覽器應用半徑邊框的安全方法?
如何在所有瀏覽器(例如IE,WebKit,Mozilla)上執行此操作?
如果瀏覽器不支持border-radius屬性,則默認爲無半徑(方形角)。
border-radius.com是爲這個偉大的:
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
如果IE曾經支持過任何標準,那就請吃我的帽子。
這是可以期待的最好:
-webkit-border-top-left-radius: 3px;
-webkit-border-top-right-radius: 3px;
-moz-border-radius-topleft: 3px;
-moz-border-radius-topright: 3px;
border-top-left-radius: 3px;
border-top-right-radius: 3px;
編輯:我不好,錯過了「左上角和右上角只是」部分,糾正codez
IE是第一個在他的列表中,但唯一沒有被你的例子所覆蓋的:P檢查我發佈的鏈接 – meo 2010-05-03 17:11:19
是真的,但OP也說「如果瀏覽器不支持邊界半徑屬性,只是默認爲無半徑「,這將發生什麼。所以答案是正確的。 – 2010-05-03 17:12:39
詳細說明@sarah,這正是你想要的。 IE不支持圓角,所以它只會顯示方形。 WebKit(Safari)和Moz(Firefox等)通過瀏覽器特定的CSS(帶前綴的規則)支持圓角。簡單的'邊界半徑'用於未來打樣。 – 2010-05-03 17:14:27
檢查這個話題。它應該涵蓋所有的需求在圓角: Emulating CSS3 border-radius and box-shadow in IE7/8
border-top-left-radius:3px;
border-top-right-radius:3px;
-webkit-border-top-right-radius:3px;
-webkit-border-top-left-radius:3px;
-moz-border-radius-topright:3px;
-moz-border-radius-topleft:3px;
這將在Mozilla和Webkit的瀏覽器,並支持任何CSS3的邊界半徑財產的工作。 IE =沒有去。另外,你應該注意到FF2會支持這一點,但圓潤的邊緣不是很漂亮。
MSIE呢? – sarah 2010-05-03 17:13:04
查看我發佈給msie的鏈接。 – meo 2010-05-03 17:16:34
meo的鏈接很好。跳轉到此頁面:http://www.smashingmagazine.com/2010/04/28/css3-solutions-for-internet-explorer/。 MSIE沒有簡單的CSS解決方案。 :-( – artlung 2010-05-03 18:05:23