メソッド: 1. border-color 属性は 4 つの境界線の色を同時に設定します; 2. border-top-color、border-bottom-color、border-left-color、および border -right-color 属性は個別に設定され、上下左右の境界線が設定されます。
このチュートリアルの動作環境: Windows 7 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
css set border color
方法 1: border-color 属性を使用して 4 つの境界線の色を同じに設定するtime
border-color プロパティは、要素のすべての境界線の表示部分の色を設定する短縮プロパティです。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
.box{
width: 280px;
height: 62px;
border-style:solid;
border-color: red;
}
</style>
</head>
<body>
<div class="box">欢迎来到PHP中文网！</div>
</body>
</html>レンダリング:
方法 2: 上下左右の境界線をそれぞれ設定します
border-top-color プロパティ: 上の境界線の色
border-bottom-color プロパティ: 下の境界線の色
border-left-color 属性: 左の境界線の色
border-right-color 属性: 右の境界線の色
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
.box{
width: 280px;
height: 62px;
border-style:solid;
border-top-color:red;
border-bottom-color:paleturquoise;
border-left-color:palevioletred;
border-right-color:darkcyan;
}
</style>
</head>
<body>
<div class="box">欢迎来到PHP中文网！</div>
</body>
</html>レンダリング:
(学習ビデオ共有: css ビデオ チュートリアル)
以上がCSSで枠線の色を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
![[Web フロントエンド] Node.js クイック スタート](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
