1.画圆角
<style>
div{
width: 200px;
height: 200px;
background-color: pink;
/* 一个值是4个角 */
border-radius: 10px;
/* 三个值是对角 */
border-radius: 10px 20px 40px;
/* 二个值也是对角 */
border-radius: 10px 80px;
}
</style>
</head>
<body>
<div>
</div>
</body>
2.画⚪
画一个正圆
1.盒子必须是正方形
2.设置边框圆角为盒子宽高的一半border-radius50%
<style>
.one {
width: 100px;
height: 100px;
background-color: pink;
border-radius: 50px;
border-radius: 50%;
}
</style>
</head>
<body>
<div class="one"></div>
</body>
3.画胶囊按
钮
1.盒子要求是长方形
2.设置一border-radius:盒子高度的一半
<style>
.two{
width: 400px;
height: 100px;
background-color: purple;
border-radius: 50px;
}
</style>
</head>
<body>
<div class="two"></div>
</body>
8683
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
