我了解到我们也可以使用这种语法制作椭圆边界半径。
border-radius: horizontal radius / vertical radius
首先，我尝试了border-radius: 10px 20px/10px，这是有效的。
然后，我尝试border-radius: 20px/10px 10px/10px，它没有用，Chrome开发者工具将其强调为错误。
感到困惑和沮丧，我去了MDN，然后更加困惑。
它显示了类似border-radius: 10px 5% / 20px 25em 30px 35em的内容，不是很奇怪吗？虽然他们在评论中提到价值属于/* (first radius values) / top-left | top-right | bottom-right | bottom-left */，但是first radius values。
我进一步研究它，看起来更加混乱。我知道我错过了什么，但不知道是什么！
答案 0 :(得分：6)
完整地看一下，你有：
border-radius: TLH TRH BRH BLH / TLV TRV BRV BLV;
其中
T / B是上/下，
L / R是左/右，和
H / V是水平/垂直
如果您没有“/ vertical size”，则默认为复制水平尺寸（因此为圆角）。如果您没有4种尺寸，则会重复您给出的值。
一旦你掌握了基本结构，就可以试验价值，看看会发生什么。这是了解事情的好方法：）