HTMLDOMスタイルborderRightColorプロパティ
HTML DOM borderRightColorプロパティは、要素の右境界線の色を取得または設定するために使用されます。
以下は、-
の構文です。borderRightColorプロパティの設定-
object.style.borderRightColor = "color|transparent|initial|inherit"
上記の特性は次のように説明されます-
| 色 | 右枠の色を指定します。デフォルトの色は黒に設定されています |
| 透明 | これにより、右の境界線の色が透明になり、基になるコンテンツが表示されます。 |
| 初期 | このプロパティをデフォルト値に設定する場合 |
| 継承 | 親プロパティ値を継承します。 |
borderRightColorプロパティの例を見てみましょう：
例
<!DOCTYPE html>
<html>
<head>
<style>
#IMG1 {
border-right:solid 8px;
border-right-color: orange;
}
</style>
<script>
function changeBorderRight(){
document.getElementById("IMG1").style.borderRightColor="lightgreen";
document.getElementById("Sample").innerHTML="The border Right color is now changed to green";
}
</script>
</head>
<body>
<img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150
">
<p>Change the above image border Right color by clicking the below button</p>
<button onclick="changeBorderRight()">Change Border Color</button>
<p id="Sample"></p>
</body>
</html> 出力
「境界線の色を変更」をクリックすると 」ボタン-
上記の例では-
cssスタイルが適用されたID「IMG1」の画像要素を作成しました。 cssスタイルは、境界線の左側のスタイルと境界線の左側の色を指定します。
#IMG1 {
border-right:solid 8px;
border-right-color: orange;
}
<img id="IMG1" src="https://www.tutorialspoint.com/blue_prism/images/blueprism-logo.jpg?auto=compress&cs=tinysrgb&dpr=2&h=550&w=150
"> 次に、ユーザーがクリックするとchangeBorderRight（）メソッドを実行する「ChangeBorderColor」という名前のボタンを作成しました-
<button onclick="changeBorderRight()">Change Border Color</button>
changeBorderRight（）メソッドは、getElementById（）メソッドを使用してIDが「IMG1」の要素を取得し、そのborderRjghtColorスタイルプロパティをlightgreenに設定します。これにより、右の境界線の色が薄緑色に変更され、innerHTMLプロパティ-
function changeBorderRight(){
document.getElementById("IMG1").style.borderLeftColor="lightgreen";
document.getElementById("Sample").innerHTML="The border left color is now changed to green";
} -
HTMLDOMスタイルborderRightColorプロパティ
HTML DOM borderRightColorプロパティは、要素の右境界線の色を取得または設定するために使用されます。 以下は、-の構文です。 borderRightColorプロパティの設定- object.style.borderRightColor = "color|transparent|initial|inherit" 上記の特性は次のように説明されます- 値 説明 色 右枠の色を指定します。デフォルトの色は黒に設定されています 透明 これにより、右の境界線の色が透明になり、基になるコンテンツが表示されます。 初期 このプロパティを
-
HTMLDOMスタイルの色のプロパティ
HTML DOM Style colorプロパティは、テキストの色を取得または設定するために使用されます。テキストの色は、16進数、rgb（）、rgba（）、hsl（）、hsla（）で指定するか、既知のキーワードを使用して指定できます。 以下は、-の構文です。 色のプロパティを設定する- object.style.color = "color|initial|inherit" 上記の特性は次のように説明されます- 値 説明 色 テキストの色の値を指定します。 初期 このプロパティを初期値に設定します。 継承 親プロパティ値を継承するには