Detaillierte Erläuterung des Border-Attributs des CSS-Stils

Detaillierte Verwendung von

border:

1. border-width AttributeLegen Sie die Breite des Rahmens fest

Möglicher Wert: Pixel

2, border-style-Attribut legt den Stil des Rahmens fest

Mögliche Werte: durchgezogen (gerade Linie), gestrichelt (gestrichelte Linie) , gepunktet (gepunktete Linie) )

2. border-color Eigenschaft legt die Farbe des Rahmens fest

Mögliche Werte: red, #f00, #ff0000, rgb( 255,0,0), transparent

border-left-Eigenschaft legt den linken Rand fest

border-rightEigenschaft legt den rechten Rand fest

border-topAttribute legen den oberen Rand fest

border-bottomAttribute legen den unteren Rand fest

Erweiterte Erweiterung

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;
}

Ergebnis

CSS Code

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

Ergebnis

CSS-Code

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

Ergebnis

CSS-Code

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

Ergebnis

CSS-Code

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

Ergebnis

CSS-Code

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

Ergebnis

Das obige ist der detaillierte Inhalt vonDetaillierte Erläuterung des Border-Attributs des CSS-Stils. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!