这两种方法中哪一种符合W3C标准?它们是否都能在浏览器中正常运行?

边界:没有; 边界:0;


当前回答

它们实际上是等价的,指向不同的快捷方式:

border: 0;
//short for..
border-width: 0;

另一个…

border: none;
//short for...
border-style: none;

两者都可以,只要选择一个就可以了:)

其他回答

使用

border: none;

不能在某些版本的IE中工作。 IE9很好,但在以前的版本中,即使样式为“none”,它也会显示边框。 我在使用不希望在输入框上设置边框的打印样式表时就遇到过这种情况。

border: 0;

似乎在所有浏览器中都能正常工作。

它们实际上是等价的,指向不同的快捷方式:

border: 0;
//short for..
border-width: 0;

另一个…

border: none;
//short for...
border-style: none;

两者都可以,只要选择一个就可以了:)

用css删除边框的最简单方法

border: 0;

虽然结果很可能是相同的(没有边界),但0和none在技术上解决的是不同的问题。

0表示边框宽度,none表示边框样式。显然宽度为0的边框是不存在的,因此没有样式。

但是,如果稍后在样式表中打算覆盖这一点,那么自然需要专门处理其中一个。如果我现在想要一个3px的边框,这将直接覆盖border:宽度为0。如果我现在想要一个虚线边界,这将直接覆盖边界:没有关于样式。

两者都成立。这是你的选择。

我更喜欢border:0,因为它更短;我觉得这样更容易理解。你可能会发现没有比这更清楚的了。我们生活在一个CSS后处理非常强大的世界,所以我建议你使用任何你喜欢的,然后通过“压缩器”运行它。这里没有什么值得打的圣战,但Webpack→LESS→PostCSS→PurgeCSS是一个很好的2020堆栈。

也就是说,如果你所有的CSS都是手写的,我认为——尽管评论中有抱怨——注意带宽并没有坏处。使用border:0会节省无穷小的带宽,但如果你让每个字节都有价值,你会让你的网站更快。


CSS2规范在这里。这些在CSS3中得到了扩展,但与此无关。

'border'
    Value:      [ <border-width> || <border-style> || <'border-top-color'> ] | inherit
    Initial:    see individual properties
    Applies to:     all elements
    Inherited:      no
    Percentages:    N/A
    Media:      visual
    Computed value:     see individual properties 

你可以使用任何宽度、样式和颜色的组合。 这里,0设置宽度,none设置样式。它们有相同的渲染结果:什么都不显示。