CSS边框半径属性中的“/”是啥意思？ [复制]

Posted 2023-03-06

【中文标题】CSS边框半径属性中的“/”是啥意思？ [复制]

【英文标题】：what does "/" mean in css border-radius property? [duplicate]CSS边框半径属性中的“/”是什么意思？ [复制]

【发布时间】：2019-12-01 17:12:51

【问题描述】：

我正在寻找一些弯曲的页脚，结果遇到了this one

然后我看到它在border-radius 属性上使用了“/”，这是什么意思？

【问题讨论】：

developer.mozilla.org/en-US/docs/Web/CSS/border-radius

欢迎来到 Stack Overflow。这个问题没有显示任何研究工作。 Stack Overflow 希望您在提问之前先try to solve your own problem first。

有一阵子我忘了斜线叫“斜线”，对不起，我会尽力防止它再次发生

【参考方案1】：

/ 用于分隔水平和垂直半径的值。

从W3C 解释：斜线之前的值将设置水平半径，斜线之后的值将设置垂直半径。如果没有给出半径，那么两个半径将相等。

要了解水平和垂直半径的工作原理，您可以在相关角（例如左上角）上绘制四分之一圆。如果将border-radius设置为：border-radius:1000px 0 0 0 /90px 0 0 0;，水平半径将拉伸1000px，从而将左上角的曲线向右拉伸1000px。垂直半径将延伸 90px，因此左上角的曲线将向下延伸 90px。

您可以查看此article 以获得其他说明。