CSS border-top-left-radius 属性

定義と使用法

border-top-left-radius 属性は、左上隅の境界線の形状を定義します。

ヒント：この属性は、要素に角の丸みのある境界線を追加することができます。

参照もしてください：

CSS3 チュートリアル：CSS3 边框

例

div要素の左上隅に角の丸みのある境界線を追加します：

div
{
border:2px solid;
border-top-left-radius:2em;
}

実際に試してみてください

CSS 文法

border-bottom-right-radius: length|% [length|%];

注記：border-top-left-radius 属性の長さ値と百分比值は、四分の円弧（外部境界線の角の形状を定義）の半径（radii）を定義します。最初の値は水平半径、第二の値は垂直半径です。第二の値を省略すると、最初の値がコピーされます。長さが0の場合、角は四角形ではなく円形になります。水平半径の百分比值は境界ボックスの幅を参照し、垂直半径の百分比值は境界ボックスの高さを参照します。

属性値

値 説明 テスト
length 左下の角の形状を定義します。 テスト
% 百分比值で左下の角の形状を定義します。 テスト

技術的詳細

デフォルト値： 0
継承性： いいえ
バージョン： CSS3
JavaScript 文法： object.style.borderTopLeftRadius="5px"

ブラウザのサポート

このテーブルの数字には、その属性を完全にサポートする最初のブラウザのバージョンが記載されています。

Chrome IE / Edge Firefox Safari Opera
5.0
4.0 -webkit-		 9.0 4.0
3.0 -moz-		 5.0
3.1 -webkit-		 10.5