问使用比元素尺寸大得多的CSS边框半径

EN

这里根本没有问题。你可以随心所欲地申请这门课，没有任何问题。小于(高度或宽度小于)的元素将变成圆圈，大于(高度或宽度大于)的元素将不成为圆，而是保持其原始形状，但具有很大的圆角。

这是在W3 这里提出来的

“如果任何水平半径大于盒子宽度的一半，它就会缩小到这个值。如果任何垂直半径大于盒子高度的一半，它就会被缩小到这个值。(有四条水平半径和四条垂直半径。)这是一个简单的算法，因为它可以独立于所有其他半径来查看每个半径，但它不允许可能有用的边框将大小半径组合在一起，它可能会将四分之一圆圈变成四分之一椭圆。”- 属性。

我应该指出，您可以使用百分比作为一个值，50%是最大的，将创建一个圆，给定的元素是一个正方形。如果元素不是正方形，那么它将创建一个椭圆。

还请注意，所有50%以上的值，当应用到所有角(比如将其应用于每个角的速记border-radius:50% )时，都将等于50%。正如注释中的jbutler483 指出一样，如果将其应用于单个角，则50%与100%不同，因为它们是如何结合在一起的。相反，所有100%以上的值都相当于100%。

同样重要的是要注意，如果元素不是正方形的话，像border:50%和border:really-high-pixel-value这样的东西会产生不同的效果。

这是W3 CSS发行-29，它是在规范中遵循选项3的已解决，作为记录在案。

如果任何相邻的边界半径都很大，以至于它们相交，那么所有的边界半径都按比例减小，这样就没有交叉。

在特殊情况下，所有四个半径在一个平方单元上是相同的，并且半径大于盒子尺寸的一半，它们被缩小到宽度/高度的一半，从而最终形成一个圆。