【CSS Modules】border-right-widthプロパティの使い方

border-right-widthプロパティは、HTML要素の右側の境界線（ボーダー）の幅を設定するプロパティです。ウェブページ上で要素の右端に表示される線の太さを指定するために使用され、デザインやレイアウトを細かく調整する際に役立ちます。

このプロパティには、いくつかの値を指定できます。まず、thin（細い）、medium（中程度の太さ）、thick（太い）といったキーワード値があり、これらはブラウザが定義する相対的な太さを表します。次に、px（ピクセル）、em（親要素のフォントサイズに対する相対値）、rem（ルート要素のフォントサイズに対する相対値）、%（親要素の幅に対する割合）などの具体的な長さの単位を用いて、任意の数値を指定することが可能です。例えば、1pxや0.5emのように記述します。ただし、境界線の幅は物理的な長さであるため、負の値を指定することはできません。

border-right-widthプロパティの初期値はmediumです。つまり、特にこのプロパティの値を指定しない場合、右側の境界線は中程度の太さで表示されます。ただし、境界線を表示させるためには、border-right-styleプロパティなどで境界線のスタイルも同時に設定する必要があります。スタイルが設定されていない場合、このプロパティで幅を指定しても境界線は表示されません。

このプロパティは、上下左右すべての境界線の幅を一括で設定するborder-widthショートハンドプロパティの一部でもあります。また、border-rightというショートハンドプロパティを使用すると、右側の境界線の幅、スタイル、色をまとめて指定することができ、コードをより簡潔に記述することが可能です。ウェブサイトの視覚的な表現を豊かにするために、非常に重要なプロパティの一つです。

Copy
1border-right-width: 2px;

引数なし

引数はありません

戻り値なし

戻り値はありません