Caution
お使いのブラウザはJavaScriptが実行できない状態になっております。
当サイトはWebプログラミングの情報サイトの為、
JavaScriptが実行できない環境では正しいコンテンツが提供出来ません。
JavaScriptが実行可能な状態でご閲覧頂くようお願い申し上げます。
- トップページ
- CSSプロパティ辞典
- border-top-color
border-top-color
上部の境界線の色に関する項目を指定できます。
サンプルコード
div.test { border-top-color: red;}
div.test1 { border-top-color: #ff0;}
div.test2 { border-top-color: transparent;}
指定可能な値一覧
| 値 | 概要 |
|---|---|
| transparent | 境界線を透明色に指定します。 |
| カラーコード、もしくはカラーネーム | 境界線を指定した色へ変更します。『border-top-color』に関する項目が指定されていない場合は『color』プロパティに指定されている色が初期値となります。 |
ブラウザでの表示結果
※ 以下のサンプルの『border-style』プロパティは『solid』を指定しています。
<div style="border-top-color: red; border-style: solid; height: 100px; padding: 10px; font-weight: bold;">高さ100px、パディング10pxのdiv要素です。</div>
対応ブラウザ
デスクトップ
Chrome1 以降 ○
Firefox1 以降 ○
Safari1 以降 ○
Edge12 以降 ○全バージョンで対応しています
IE11 ○10 ○9 ○
8 ○7 ○
6 ○
Opera3.5 以降 ○
2 以前 ×モバイル
iOS Safari1 以降 ○
Android Browser4.4 以降 ○3 以前 × Chrome Android最新版 ○デスクトップ版と同等の対応です
Firefox Android最新版 ○デスクトップ版と同等の対応です
※ バージョン情報は MDN に基づいています。
概要
上部の境界線の色に関する項目を指定できます。
『border-top-color』プロパティに何も指定していない場合は『color』プロパティに設定されている色が初期値となります。
記事の間違いや著作権の侵害等ございましたらお手数ですがこちらまでご連絡頂ければ幸いです。
シェアする