17 lines
920 B
Markdown
17 lines
920 B
Markdown
|
---
|
|||
|
|
title: CSS3 Border Radius Property
|
|||
|
|
localeTitle: CSS3 Border Radius属性
|
|||
|
|
---
|
|||
|
|
## CSS3 Border Radius属性
|
|||
|
|
|
|||
|
|
您可以使用`border-radius`属性使元素的边框变圆。您可以将一到四个值设置为`border-radius`属性：
|
|||
|
|
|
|||
|
|
* `border-radius: 5px;` - 此规则适用于所有角落
|
|||
|
|
* `border-radius: 5px 10px` - 此规则将第一个值应用于_左上角_和_右下角_ ，第二个值应用于_右上角_和_左下角_ 。
|
|||
|
|
* `border-radius: 3px 5px 7px 10px` - 此规则将第一个值应用于_左上角_ ，第二个值应用于_右上角_ ，第三个值应用于_右下角_ ，第四个值应用于_左下角_ 。
|
|||
|
|
* 如果是三个值，则第二个值适用于_右上角_和_左下角_ 。
|
|||
|
|
|
|||
|
|
#### 更多信息：
|
|||
|
|
|
|||
|
|
* [MDN - border-radius](https://developer.mozilla.org/en-US/docs/Web/CSS/border-radius)
|
|||
|
|
* [CSS-Tricks - border-radius](https://css-tricks.com/almanac/properties/b/border-radius/)
|