ホームページ > ウェブフロントエンド > CSSチュートリアル > CSSでdivの境界線の色を設定する方法

CSSでdivの境界線の色を設定する方法

藏色散人
リリース: 2023-01-03 09:26:40
オリジナル
7404 人が閲覧しました

div の境界線の色を設定する Css メソッド: 最初に HTML サンプル ファイルを作成し、次に div を定義し、最後に「border-color」または「border-left-color」などの属性を追加して境界線を設定します。 div 色を付けるだけです。

CSSでdivの境界線の色を設定する方法

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、Dell G3 コンピューター。

css は div

1 に境界線の色を追加します。css は div の 4 つの側面に境界線を追加します

border-color:#000(设置4边边框颜色为黑色)
border-color:+颜色值,即可设置对象边框颜色
border-left-color:#000 设置左边框颜色为黑色
border-right-color:#000 设置右边框颜色为黑色
border-top-color:#000 设置上边框颜色为黑色
border-bottom-color:#000 设置下边框颜色为黑色
ログイン後にコピー

条件: オブジェクトの境界線が設定されている必要があります存在するには、境界線の色が表示されて意味を持つようになる前に、境界線の幅が 1 ピクセル以上である必要があります。

例:

.div{ 
    border-style: solid; 
    border-width: 1px; 
    border-color: #000;
}
ログイン後にコピー

このように、オブジェクトの境界線を実線の境界線に設定し、境界線の幅 (太さ) を 1px に、境界線の色を黒に設定します。有効になります。

2. 境界線の色スタイル設定の省略簡略化

.div{ 
    border-style:solid; 
    border-width:1px; 
    border-color:#000;
}
ログイン後にコピー

このようにして、「.div」オブジェクトの境界線スタイルが設定されるため、これを省略できます

.div{ 
    border:solid 1px #000;
}
ログイン後にコピー

効果:

CSSでdivの境界線の色を設定する方法

3 つの境界線の値はスペースで区切られています。

境界線の色のスタイル コードを省略すると、コードを節約し、CSS コードの量を減らすことができます。

[推奨学習: CSS ビデオ チュートリアル ]

以上がCSSでdivの境界線の色を設定する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
css
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート