border-style:none时设置border-radius为何会有效果

Question

如果border-style为none时，不是相当于没有border，此时再设置border-radius的值，比如5px，会出现圆形效果，这是什么呢

Answer 1

The radius applies to the whole background, even if the element has no border;

即使没有border，圆角效果也会应用到整个背景上去。

参考链接：https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius

Answer 2

如果 border: none 就导致 border-radius 失效，那么没有 border 的盒模型就不能设置圆角效果了，估计直接去标准制定者那里问“为什么？这不合理！”的人会更多 ;-)

既然发现了这两个样式是独立的，知不知道为什么（见 @代码宇宙 给出的链接）结果都是一样的，如果要抑制这个效果，除了设置 border 还需要设置 border-radius。

Answer 3

可以理解为border-style只是border的显示形式，这个style为none只是说明border不显示(width为0)，但是border本身是存在的。。。