css怎么设置div圆角

lewis 6年前 (2019-03-09) 阅读数 10 #程序编程

文章标签 css div

css设置div圆角的方法：

在css中可以通过设置border-radius让div边角变得圆润。

示例：

<!DOCTYPEhtml><html>
<head>
<style>
#rcorners1{
border-radius:25px;
background:#73AD21;
padding:20px;
width:200px;
height:150px;
}
#rcorners2{
border-radius:25px;
border:2pxsolid#73AD21;
padding:20px;
width:200px;
height:150px;
}
#rcorners3{
border-radius:25px;
background:url(/i/paper.jpg);
background-position:lefttop;
background-repeat:repeat;
padding:20px;
width:200px;
height:150px;
}
</style>
</head>
<body>
<h1>border-radius属性</h1>
<p>拥有指定背景颜色的元素的圆角：</p>
<pid="rcorners1">Roundedcorners!</p>
<p>带边框元素的圆角：</p>
<pid="rcorners2">Roundedcorners!</p>
<p>拥有背景图片的元素的圆角：</p>
<pid="rcorners3">Roundedcorners!</p>
</body>
</html>