css中圆角只想取一边怎么写

201 阅读 0 评论 133 点赞

我是靠谱客的博主贪玩舞蹈，这篇文章主要介绍css中圆角只想取一边怎么写，现在分享给大家，希望可以做个参考。

本教程操作环境：windows10系统、CSS3&&HTML5版、Dell G3电脑。

css中圆角只想取一边怎么写

在css中，可以利用border-radius属性来实现只显示一边圆角，该属性用于设置元素的圆角样式。

语法为：

复制代码border-radius：左上圆角值 右上圆角值 右下圆角值 左下圆角值；1
border-radius：左上圆角值 右上圆角值 右下圆角值 左下圆角值；
登录后复制

示例如下：

复制代码<!DOCTYPE html>
<html>
<head>
<style> 
div{
border:2px solid #a1a1a1;
height:350px;
background:#dddddd;
width:350px;
border-radius:25px 25px 0 0;
}
</style>
</head>
<body>
<div></div>
</body>
</html>1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<!DOCTYPE html>
<html>
<head>
<style> 
div{
border:2px solid #a1a1a1;
height:350px;
background:#dddddd;
width:350px;
border-radius:25px 25px 0 0;
}
</style>
</head>
<body>
<div></div>
</body>
</html>
登录后复制