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