先来看一个现象,解释一下为何两者的圆角效果是一致的。
css 的代码如下:
.e1 {
border-radius: 100% 100% 0 0 / 100% 0 0 0;
}
.e2 {
border-radius: 50% 0 0 0 / 50% 0 0 0;
}
e2 好理解,水平和垂直的圆角都是 50px;但是 e1 怎么理解呢?这里就涉及到了当圆角半径超出盒宽高的计算公式了。
继续阅读“border-radius 的值超过宽高的计算公式”先来看一个现象,解释一下为何两者的圆角效果是一致的。
css 的代码如下:
.e1 {
border-radius: 100% 100% 0 0 / 100% 0 0 0;
}
.e2 {
border-radius: 50% 0 0 0 / 50% 0 0 0;
}
e2 好理解,水平和垂直的圆角都是 50px;但是 e1 怎么理解呢?这里就涉及到了当圆角半径超出盒宽高的计算公式了。
继续阅读“border-radius 的值超过宽高的计算公式”