border-radius属性用于设置元素边框的圆角半径。属性值可以是无单位值（单位为父元素字体的x-高度）、单位值或者多个值，可以分别指定顶端、右侧、底部和左侧的圆角半径。根据指定的值，可以设置所有圆角的半径相同、设置水平圆角和垂直圆角不同的半径、设置顶部圆角和侧面/底部圆角不同的半径，或分别设置四个圆角不同的半径。
border-radius 属性的作用
border-radius 属性用于设置元素边框的圆角半径，使其呈现圆角效果。
属性值
border-radius 属性接受以下值：
无单位值：指定圆角半径，单位为元素的父元素字体的 x-高度（x-height）。单位值（px、%、em 等）：指定圆角半径的绝对值。多个值：可以指定四个值，分别对应顶端、右侧、底部和左侧的圆角半径。
使用方法
语法：
border-radius: [top-left] [top-right] [bottom-right] [bottom-left];
其中，各值可以是：
单个值：设置所有圆角的半径相同。两个值：前一个值设置水平圆角（顶部和底部），后一个值设置垂直圆角（左侧和右侧）。三个值：前两个值设置顶部圆角半径，第三个值设置侧面和底部圆角半径。四个值：分别设置顶部、右侧、底部和左侧的圆角半径。
示例
/* 设置所有圆角半径为 10px */border-radius: 10px;/* 设置水平圆角半径为 20px，垂直圆角半径为 10px */border-radius: 20px 10px;/* 设置顶部圆角半径为 20px，其他圆角半径为 10px */border-radius: 20px 10px 10px;/* 分别设置四个圆角半径 */border-radius: 10px 20px 30px 40px;
以上就是border-radius属性的作用是的详细内容，更多请关注创想鸟其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。
如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至 chuangxiangniao@163.com 举报，一经查实，本站将立刻删除。
发布者：程序猿，转转请注明出处：https://www.chuangxiangniao.com/p/1629134.html
微信扫一扫 
支付宝扫一扫 
