border:none;与border:0;的区别

2016-02-20 00:08 9 1 收藏

清醒时做事,糊涂时读书,大怒时睡觉,无聊时关注图老师为大家准备的精彩内容。下面为大家推荐border:none;与border:0;的区别,无聊中的都看过来。

【 tulaoshi.com - Web开发 】

这问题在网络相信已经有不少人问到,最近再次被牵起讨论,籍此记录一下个人的理解,border:none;与border:0;的区别体现有两点:一是理论上的性能差异二是浏览器兼容性的差异。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)性能差异

 

把border设为0像素虽然在页面上看不见,但按border默认值理解,浏览器依然对border-width/border-color进行了渲染,即已经占用了内存值。

把border设为none即没有,浏览器解析none时将不作出渲染动作,即不会消耗内存值。

兼容性差异

 

兼容性差异只针对浏览器IE6、IE7与标签button、input而言,在win、win7、vista 的XP主题下均会出现此情况。

当border为none时似乎对IE6/7无效边框依然存在,如下例:

Demo1

当border为0时,感觉比none更有效,所有浏览器都一致把边框隐藏,如下例:

Demo2

总结:

对比border:0;与border:none;之间的区别在于有渲染和没渲染,感觉他们和display:none;与visibility:hidden;的关系类似,而对于border属性的渲染性能对比暂时没找测试的方法,虽然认为他们存在渲染性能上的差异但也只能说是理论上。

(本文来源于图老师网站,更多请访问https://www.tulaoshi.com/webkaifa/)

如何让border:none;实现全兼容?只需要在同一选择符上添加背景属性即可,如下例:



demo3

对于border:0;与border:none;个人更向于使用,border:none;,因为border:none;毕竟在性能消耗没有争议,而且兼容性可用背景属性解决不足以成为障碍。

来源:https://www.tulaoshi.com/n/20160220/1631339.html

延伸阅读
标签: Java JAVA基础
您现在可能已在使用 Javabeans,但还不了解它。如果有支持 Java 的浏览器,那么,在桌面上使用 Javabeans 就没有限制。使用的 Web 页面可以将 beans 作为小应用程序的一部分。您很快就会和作为浏览器可视部分的 Javabeans 交互,然后,那些 Javabeans 将与服务器上的 EJB 接口。这种能力也可以扩展到因特网和内部网。 Java...
【粉刺和痤疮区别】 人们会经常接触到两个名词:粉刺和痤疮。它们是不是一样呢?如果不一样,粉刺和痤疮的区别在哪里呢? 痤疮是一个统称,粉刺常常是指尚未发炎的白头、黑头而言。而痤疮是已经发炎的一系列皮肤症状。 非炎性包括: (1)微粉刺:在毛囊漏斗部角质细胞堆积,开成微小的青春痘,肉眼几乎看不见,临...
好动与多动症的区别 妈妈看到自己的宝宝总是不安分,担心宝宝是患了多动症,其实有些宝宝只是天性好动,如何区别好动与多动呢? 1、正常好动的孩子,虽然也有注意力下集中的表现,但对有兴趣的事情,却能专心致志,很少分散;而多动症的孩子做不到。 2、正常儿童www.Tulaoshi.com虽然表现散漫,如上课做小动作,...
标签: Java JAVA基础
JSP和SERVLET到底在应用上有什么区别,很多人搞不清楚。我来胡扯几句吧。简单的说,SUN首先发展出SERVLET,其功能比较强劲,体系设计也很先进,只是,它输出HTML语句还是采用了老的CGI方式,是一句一句输出,所以,编写和修改HTML非常不方便。 后来SUN推出了类似于ASP的镶嵌型的JSP,把JSP TAG镶嵌到HTML语句中,这样,就大大简化和方便了网页...
性质不同 股票与储蓄存款虽然都是建立在信用的基础上,但其性质不同。股票是以资本信用为基础,它体现着股份公司与股东之间围绕着投资而形成的权利和义务关系。而储蓄存款则是一种银行信用,它所建立的是银行与储户之间的借贷性债权债务关系。股票的购买者是股份公司的股东,而存款人实际上是贷款人,他将自己暂时闲置的资金借与银行。 法...

经验教程

272

收藏

37
微博分享 QQ分享 QQ空间 手机页面 收藏网站 回到头部