CSS 円角枠線

CSS 円角枠線

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

普通边框

圆角边框

圆角边框

圆角边框

实例

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

亲自试一试

更多实例

一个声明中的所有上边框属性
本例演示简写属性，用于在一条声明中设置上边框的所有属性。
设置下边框的样式
本例演示如何设置下边框的样式。
左辺の幅を設定
この例では、左辺の幅を設定する方法を示します。
4つの辺の色を設定
この例では、4つの辺の色を設定する方法を示します。1から4色を持つことができます。
右辺の色を設定
この例では、右辺の色を設定する方法を示します。

すべての CSS 辺属性

属性 説明
border 短縮属性で、1つの宣言ですべての辺の属性を設定します。
border-color 短縮属性で、4つの辺の色を設定します。
border-radius 短縮属性で、すべての border-*-radius 属性を設定できます。
border-style 短縮属性で、4つの辺のスタイルを設定します。
border-width 短縮属性で、4つの辺の幅を設定します。
border-bottom 短縮属性で、1つの宣言ですべての下辺属性を設定します。
border-bottom-color 下辺の色を設定します。
border-bottom-style 下辺のスタイルを設定します。
border-bottom-width 下辺の幅を設定します。
border-left 短縮属性で、1つの宣言ですべての左辺属性を設定します。
border-left-color 左辺の色を設定します。
border-left-style 左辺のスタイルを設定します。
border-left-width 左辺の幅を設定します。
border-right 短縮属性で、1つの宣言ですべての右辺属性を設定します。
border-right-color 右辺の色を設定します。
border-right-style 右辺のスタイルを設定します。
border-right-width 右辺の幅を設定します。
border-top 短縮属性で、1つの宣言ですべての上辺属性を設定します。
border-top-color 上辺の色を設定します。
border-top-style 上辺のスタイルを設定します。
border-top-width 上辺の幅を設定します。