关于border-radius
border-radius: 52px / 0 0 36px 3px;
这个出来的效果为什么是水平方向不会变圆?
我理解解的是左上角水平方向到52px产生圆角,垂直方向0。那应该是垂直方向不会变才对,为什么页面显示出来水平方向不会产生圆角效果?
31
收起
正在回答 回答被采纳积分+1
2回答
好帮手慕粉
2020-03-04 15:10:12
同学你好,关于同学的问题解答如下:
1、border-radius属性一个角分为水平方向和垂直方向,例如:
效果:
所以当使用boder-radius属性合在一起写的时候,一个角的两个方向都包括了。如果要设置不一样的值,需要用/隔开。顺序为左上角-右上角-右下角-左下角 ,例如:
/前面的第一个值和/后面的第一个值是一组,后面以此类推。
2、另外:border-radius:52px/ 0px 0px 36px 36px;也可以写成border-radius:52px 52px 52px 52px/ 0px 0px 36px 36px;当值一样的时候可以省略,所以水平方向只写了一个52px。这里的52px代表的是水平方向的值。
如果我的回答帮到了你,欢迎采纳,祝学习愉快~
恭喜解决一个难题,获得1积分~
来为老师/同学的回答评分吧
0 星