Fe-interview: [css] 第156天 css中的border:none和border:0px有什么区别？

[haizhilin2013]

第156天 css中的border:none和border:0px有什么区别？

[NicholasBaiYa]

none是没有边框.
0px是边框的宽度为0px.

[codecomeon]

最简单的一个例子：
从border: 10px;过渡到border: none;，是不会有动画的；
从border: 10px;过渡到border: 0px;，是可以有动画的。

[EchoWht]

感觉border:0px浏览器解析并给border-width设置0px这个值；border:none浏览器解析后会给border-style设置为none；浏览器会先分析border的style再分析width，所以我感觉border:none会比border:0px节省性能(最后一点我猜的)

[xuzihao0226]

在于浏览器解析与否

1. border为0的情况下虽然看不见,但是浏览器会对border进行渲染,还是占据内存的
   而border为none时浏览器不会对其渲染,所以不会占据内存
2. border为none的兼容差 在老IE浏览器上还是会有边框
   而border为0的时候是可以隐藏的

[monoplasty]

border: none; 浏览器解析为

    border-top-color: initial;
  border-top-style: none;
    border-top-width: initial;
    border-right-color: initial;
  border-right-style: none;
    border-right-width: initial;
    border-bottom-color: initial;
  border-bottom-style: none;
    border-bottom-width: initial;
    border-left-color: initial;
  border-left-style: none;
    border-left-width: initial;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;

border: 0px; 浏览器解析为

    border-top-color: initial;
    border-top-style: initial;
    border-top-width: 0px;
    border-right-color: initial;
    border-right-style: initial;
    border-right-width: 0px;
    border-bottom-color: initial;
    border-bottom-style: initial;
    border-bottom-width: 0px;
    border-left-color: initial;
    border-left-style: initial;
    border-left-width: 0px;
    border-image-source: initial;
    border-image-slice: initial;
    border-image-width: initial;
    border-image-outset: initial;
    border-image-repeat: initial;

[ShuiXinSuoYu]

看法是和display：none；和display：block一样，即使DOM会不会渲染该元素。0px会存在border，none则不会存在border。与渲染dom有关。