CSSスタイルのborder属性について詳しく解説

borderの詳細な使用法:

1, border-width property境界線の幅を設定します

可能な値: ピクセル

2, border-styleプロパティは境界線のスタイルを設定します

可能な値: 実線 (直線)、破線 (破線)、点線 (点線)

2、border-color プロパティは境界線の色を設定します

可能な値: red、#f00、#ff0000 , rgb (255,0 ,0),transparent

border-leftプロパティは左の境界線を設定します

border-rightプロパティは右の境界線を設定します

border-topプロパティは上の境界線を設定します

border -bottom プロパティは下枠を設定します

Extension extension

html code

<p></p>

<p></p>

css code

 p {
    height: 20px;
    width: 20px;
    border-color: #FF9600 #3366ff #12ad2a #f0ed7a;
    border-style: solid;
    border-width: 20px;
}

result

css code

 p {    
    width: 0px;
    height: 0px;
    border-color: #FF9600 #3366ff #12ad2a #f0ed7a;
    border-style: solid;
    border-width: 20px;
}

result

CSSコード

 p {    
    width: 0px;
    height: 0px;
    border-color: lightblue transparent trnasparent transparent;
    border-style: solid;
    border-width: 20px;
}

結果

CSSコード

 p {    
    width: 0px;
    height: 0px;
    border-color: transparent trnasparent pink;
    border-style: solid;
    border-width: 20px;
}

結果

CSSコード

 p {    
    width: 0px;
    height: 0px;
    border-color: transparent gray trnasparent transparent;
    border-style: solid;
    border-width: 20px;
}

結果

CSSコード

 p {    
    width: 0px;
    height: 0px;
    border-color: transparent transparent trnasparent lightgreen;
    border-style: solid;
    border-width: 20px;
}

結果

以上がCSSスタイルのborder属性について詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。