CSS3 border-top-right-radiusプロパティ


例

div要素の右上隅に角丸ボーダーを追加します：

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

試してみる »

ブラウザサポート

表内の数字は、そのプロパティをサポートする最初のブラウザバージョン番号を示します。

-webkit-、-ms-、または -moz- の直前にある数字は、そのプレフィックス付きプロパティをサポートする最初のブラウザバージョン番号です。

プロパティ
border-radius 9.0 5.0
4.0 -webkit-		 4.0
3.0 -moz-		 5.0
3.1 -webkit-		 10.5

プロパティの定義と使用説明

border-top-right-radius プロパティは、右上隅の境界線の形状を定義します。

ヒント：このプロパティを使用すると、要素に角丸の境界線を追加できます！

デフォルト値： 0
継承： no
バージョン： CSS3
JavaScript 構文： object object.style.borderTopRightRadius="5px"

構文

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

注意：border-top-right--radiusプロパティの2つの長さまたはパーセンテージ値は、楕円の4分の1の外側の境界線の角の形状を定義します。最初の値は水平半径で、2番目は垂直半径です。2番目の値が省略された場合、最初の値からコピーされます。いずれかの長さがゼロの場合、角は角張っていて丸くありません。水平半径のパーセンテージは境界ボックスの幅を指し、垂直半径のパーセンテージは境界ボックスの高さを指します。

值 説明
length 右上隅の形状を定義します。
% %を使用して右上隅の形状を定義します。

関連記事

CSS3 チュートリアル：CSS3 Borders

その他の拡張機能