border-radius如何只设置上面
时间: 2023-07-01 15:17:43 浏览: 222
CSS3中border-radius属性设定圆角的使用技巧
5星 · 资源好评率100%
你可以使用`border-top-left-radius`和`border-top-right-radius`属性来只设置元素的上边框的圆角。这两个属性可以分别控制元素左上角和右上角的圆角大小。例如,将`border-top-left-radius`和`border-top-right-radius`都设置为`20px`,可以将元素的上边框的左右两个角设置为20像素的圆角,而保留其他三个角的直角,代码如下所示:
```css
div{
width: 200px;
height: 100px;
background-color: yellow;
border-top-left-radius: 20px;
border-top-right-radius: 20px;
}
```
上述代码会将一个黄色的`div`元素的上边框的左右两个角设置为20像素的圆角,而保留其他三个角的直角,其宽度为200像素,高度为100像素。你可以通过调整`border-top-left-radius`和`border-top-right-radius`的值来控制圆角大小。
阅读全文