border-radius四个角
时间: 2023-09-25 07:16:14 浏览: 28
CSS3的Border-radius轻松制作圆角
5星 · 资源好评率100%
border-radius属性可以用来设置一个元素的四个角的圆角程度。其语法如下:
```
border-radius: top-left top-right bottom-right bottom-left;
```
其中,top-left表示左上角,top-right表示右上角,bottom-right表示右下角,bottom-left表示左下角。你可以通过设置不同的值来控制每个角的圆角程度,如:
```
border-radius: 10px 20px 30px 40px;
```
这个例子中,左上角的圆角半径为10px,右上角的圆角半径为20px,右下角的圆角半径为30px,左下角的圆角半径为40px。如果某个角的圆角半径值为0,那么该角就不会有圆角效果。如果所有的圆角半径值都相等,那么可以简写为:
```
border-radius: 10px;
```
这个例子中,四个角的圆角半径都是10px。
阅读全文