css边框圆角：border-radius

最新推荐文章于 2025-01-01 20:57:24 发布

西红柿又名小番茄

最新推荐文章于 2025-01-01 20:57:24 发布

阅读量100

点赞数 2

文章标签： css 前端 javascript

本文链接：https://blog.youkuaiyun.com/qq_39293316/article/details/144697712

版权

/* 一个值，四个角都为 10px 圆角 */
.example1 {
  border-radius: 10px;
}
/* 两个值，左上角和右下角为 10px 圆角，右上角和左下角为 20px 圆角 */
.example2 {
  border-radius: 10px 20px;
}
/* 三个值，左上角为 10px 圆角，右上角和左下角为 20px 圆角，右下角为 30px 圆角 */
.example3 {
  border-radius: 10px 20px 30px;
}
/* 四个值，左上角为 10px 圆角，右上角为 20px 圆角，右下角为 30px 圆角，左下角为 40px 圆角 */
.example4 {
  border-radius: 10px 20px 30px 40px;
}