css3实现圆角边框-qaq卟言的个人博客

【css3实现圆角边框】

qaq卟言2020-11-16 00:38:55 Css Html

开始

1.png
很多时候在开发网页前端的时候，为了让网页上面的东西看起来更加的舒服，我们可能需要设置一些圆角的效果
比如圆形的头像、圆角的按钮等等
在圆角边框出现之前，前端开发有的采用整块的圆角图片作为背景
有的采用小的圆角图片分别放在元素的四角，非常麻烦，灵活性差，也降低了网站的整体性能
而圆角边的出现则直接降低了开发和维护的难度
圆角边框border-radius的基本用法

boder-top-left-radius：15px;      //左上角
boder-top-right-radius：15px;   //右上角
boder-top-left-radius：15px;      //左上角
boder-bottom-left-radius：15px;  //右下角

设置四个弧度的圆角相同，可以写成
```
border-radius：15px;
```

完结

🔖本文来源：qaq卟言的个人博客网站声明如损害你的权益请联系我们

📜著作协议：《知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议》

⚠️部分文章图片来自网络，可能存在版权问题。如发现相关争议请联系qaq卟言处理！

🔗

⏲

【css3实现圆角边框】

随机文章