border-radius的兼容问题
? border-radius可以便捷的制作圓角效果,不需要通過增加圓角圖片來達到效果,便于維護。
語法:border-radius:none | 1-4 length | % / 1-4 length|%
按順序設置圓角四個方向的值,和設置border的順序一樣。
' / '前后的值都存在,那么' / '前面設置的值為水平半徑,后面設置的值為垂直半徑。若沒有' / ',則水平和錘子半徑相等。
?
border-radius的兼容性:
支持的瀏覽器有: IE9+ Firefox4+ Chrome Sarari 5+ ?Opera
對于老板的瀏覽器,需要加不同的前綴,如-moz- ?-webkit-
在瀏覽器中寫法為:
-moz-border-radius:
-webkit-border-radius:
對于IE,IE9及以下不支持border-radius
低版本的IE要制作圓角效果,可以在背景上進行設置。
目前有一個辦法使低版本IE兼容border-radius效果:
.box{
border-radius:15px;
behavior:url(ie-css3.htc);
}
需要下載一個htc文件,也是通過JS寫的一個文件。在使用時,需要把這個文件放到服務器目錄中。
注:當border-radius的值小于或者等于border的值的時候,邊框內部角不再是圓角效果。
轉載于:https://www.cnblogs.com/lionisnotkitty/p/6061080.html
總結
以上是生活随笔為你收集整理的border-radius的兼容问题的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: 一些个人认为好看的电影
- 下一篇: 使用SecureCRT的SFTP在WIN