全部教程· HTML/CSS· CSS · CSS 圆角边框

CSS 圆角边框

border-radius 属性用于向元素添加圆角边框：

普通边框

圆角边框

范例

p {
  border: 2px solid red;
  border-radius: 5px;
}

1. 更多范例

一个声明中的所有上边框属性本例演示简写属性，用于在一条声明中设置上边框的所有属性。
设置下边框的样式本例演示如何设置下边框的样式。
设置左边框的宽度本例演示如何设置左边框的宽度。
设置四条边框的颜色本例演示如何设置四条边框的颜色。它可以拥有一到四种颜色。
设置右边框的颜色本例演示如何设置右边框的颜色。

2. 所有 CSS 边框属性

属性	描述
border	简写属性，在一条声明中设置所有边框属性。
border-color	简写属性，设置四条边框的颜色。
border-radius	简写属性，可设置圆角的所有四个 border-*-radius 属性。
border-style	简写属性，设置四条边框的样式。
border-width	简写属性，设置四条边框的宽度。
border-bottom	简写属性，在一条声明中设置所有下边框属性。
border-bottom-color	设置下边框的颜色。
border-bottom-style	设置下边框的样式。
border-bottom-width	设置下边框的宽度。
border-left	简写属性，在一条声明中设置所有左边框属性。
border-left-color	设置左边框的颜色。
border-left-style	设置左边框的样式。
border-left-width	设置左边框的宽度。
border-right	简写属性，在一条声明中设置所有右边框属性。
border-right-color	设置右边框的颜色。
border-right-style	设置右边框的样式。
border-right-width	设置右边框的宽度。
border-top	简写属性，在一条声明中设置所有上边框属性。
border-top-color	设置上边框的颜色。
border-top-style	设置上边框的样式。
border-top-width	设置上边框的宽度。

下一章：CSS 外边距

CSS margin 属性用于在任何定义的边框之外，为元素周围创建空间。通过 CSS，您可以完全控制外边距。有一些属性可用于设置元素每侧（上、右、下和左）的外边距。Margin - 单独的边；CSS 拥有用于为元素的每一侧指定外边距的属性：margin-top、margin-right、margin-bottom、margin-left

上一章：CSS 简写边框属性

下一章：CSS 外边距