CSS 边框的圆角
2019-07-19 本文已影响0人
氢金
重点要记住：
border-radius半径（边框圆角使用）
border-radius：（左上,右上,右下,左下）（设置一个即四个角都应用，设置两个则对角应用）
border-radius：50%可以使用px与%
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>边框圆角</title>
<style type="text/css">
#box{
width:200px;
height:100px;
border:3px solid red;
/* border-radius:30px 40px 50px 60px;
第一个左上,第二个右上,第三个右下,第四个左下 */
/* border-radius:50%;
设置圆形必须是正方形
*/
/* border-radius:50%;
设置椭圆是正方形 */
/* 结论:不仅可以使用 px也可以使用％号 */
}
</style>
</head>
<body>
<div id="box">边框圆角<div>
</div>
</body>
</html>
