1.性能差異
【`border:0;`】把`border`設為“`0`”像素雖然在頁面上看不見,但按border默認值理解,瀏覽器依然對`border-width/border-color`進行了渲染,即已經占用了內存值。
【`border:none;`】把border設為“none”即沒有,瀏覽器解析“`none`”時將不作出渲染動作,即不會消耗內存值。
對比`border:0;`與`border:none;`之間的區別在于有渲染和沒渲染,感覺他們和`display:none;`與`visibility:hidden;`的關系類似,而對于border屬性的渲染性能對比暫時沒找測試的方法,雖然認為他們存在渲染性能上的差異但也只能說是理論上。
2.兼容性差異
在IE6,7中(**如果要支持IE8以下瀏覽器,使用border:0 none;即可實現全兼容**),雖然設置了border:none后,邊框看不見了,但是實際上你會發現邊框仍然存在,而只是border-style成為了none而已,也即:在IE6,7中border:none僅等價于border-style:none,而邊框所占的空間還是在的,這就導致了我之前調整input的寬度的時候始終無法將其高度在各個瀏覽器中調整成一致的原因!
<span style="color:red;font-weight:700">Xee:</span>個人更向于使用,`border:none;`,因為`border:none;`畢竟在性能消耗沒有爭議。
1、在CSS中使用0,不要有單位
- 序
- 開發自己的博客
- 面試集合
- 基礎
- 1、JavaScript
- js技巧
- 2、CSS
- position之absolute
- em與rem
- inline-block
- background
- 圓角、透明度、漸變
- 關于css中的0和none
- css display:none小結
- z-index小結
- 理解滾動條
- 有關@font-face的問題
- 3、HTML
- URI中依賴協議的URL
- 4、MySQL
- limit使用
- 5、jQuery
- 6、移動Web開發
- 設計稿與分辨率
- 字體
- 圖片的自適應
- 7、前端布局bug問題(!<=IE8)
- SEO與頁面結構
- seo
- vsphere 虛擬服務器
- 代碼里的彩蛋(神注釋)
- 玩轉HTML5移動頁面
- 知識梳理
- JS 鍵盤碼
- 其他資源記錄
- temp
- TODO
- 簡單有趣的庫??
- xx