CSS の丸い枠線

CSS 短縮表記の境界線 CSS マージン

CSS の丸い境界線

border-radius 属性は、要素に丸い境界線を追加するために使用されます。

ノーマルフレーム

丸い境界線

丸い境界線

丸い境界線

例

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

自分で試してみてください

すべての CSS 境界線プロパティ

属性 説明
border 1 つの宣言ですべての境界線プロパティを設定するための短縮属性。
border-color 短縮プロパティ。4 つの境界線の色を設定します。
border-radius 角丸の 4 つの 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 つの宣言で設定します。
bordr-top-color 上枠の色を設定します。
bordr-top-style は上枠のスタイルを設定します。
border-top-width は上部の境界線の幅を設定します。
CSS 短縮表記の境界線 CSS マージン