HTML-Div-Element-Randlinien können mithilfe von randbezogenen Attributen festgelegt werden: 1. Das Randattribut legt gleichzeitig die Randstile oben, unten, links und rechts fest. 2. Die Randstile „Rand oben“, „Rand unten“, „Rand“ Die Attribute „left“ und „border-right“ legen den oberen, unteren, linken und rechten Rahmenstil fest.
Die Betriebsumgebung dieses Tutorials: Windows7-System, CSS3- und HTML5-Version, Dell G3-Computer.
Mit der CSS-Rahmeneigenschaft können Sie den Stil und die Farbe des Rahmens eines Elements festlegen.
Beispiel:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <style type="text/css"> div { width: 250px; margin: 50px 0px; padding: 20px 10px; } .box1{ border: 1px solid red; } .box2{ border-top: 1px solid green; } .box3{ border-bottom: 1px solid green; } .box4{ border-left: 1px solid green; } .box5{ border-right: 1px solid green; } </style> </head> <body> <div class="box1">border属性设置使用边框样式</div> <div class="box2">border-top属性设置上边框样式</div> <div class="box3">border-bottom属性设置下边框样式</div> <div class="box4">border-left属性设置左边框样式</div> <div class="box5">border-right属性设置右边框样式</div> </body> </html>
Rendering:
[Empfohlene Tutorials: CSS-Video-Tutorial, HTML-Video-Tutorial]
CSS-Rahmeneigenschaften
Eigenschaften | Beschreibung |
---|---|
border | abgekürztes Attribut, das zum Festlegen der Attribute für vier Seiten in einer Anweisung verwendet wird. |
border-style | wird verwendet, um den Stil aller Ränder eines Elements festzulegen oder den Rahmenstil für jede Seite einzeln festzulegen. |
border-width | Abkürzungsattribut, mit dem die Breite aller Ränder eines Elements oder die Breite jedes Rahmens einzeln festgelegt werden kann. |
border-color | Kurzschriftattribut, legen Sie die Farbe der sichtbaren Teile aller Ränder des Elements fest, oder legen Sie die Farbe für jede der 4 Seiten fest. |
border-bottom | Abkürzungsattribut, mit dem alle Attribute des unteren Rands in einer Anweisung zusammengefasst werden. |
border-bottom-color | Legt die Farbe des unteren Randes des Elements fest. |
border-bottom-style | Legen Sie den Stil des unteren Rands des Elements fest. |
border-bottom-width | Legen Sie die Breite des unteren Rands des Elements fest. |
border-left | Abkürzungsattribut, mit dem alle Attribute des linken Rands in einer Anweisung zusammengefasst werden. |
border-left-color | Legen Sie die Farbe des linken Randes des Elements fest. |
border-left-style | Legen Sie den Stil des linken Rands des Elements fest. |
border-left-width | Legt die Breite des linken Randes des Elements fest. |
border-right | Abkürzungsattribut, mit dem alle Attribute des rechten Rands in einer Anweisung zusammengefasst werden. |
border-right-color | Legt die Farbe des rechten Randes des Elements fest. |
border-right-style | Legen Sie den Stil des rechten Rands des Elements fest. |
border-right-width | Legen Sie die Breite des rechten Randes des Elements fest. |
border-top | Abkürzungsattribut, mit dem alle Attribute des oberen Rands in einer Anweisung zusammengefasst werden. |
border-top-color | Legen Sie die Farbe des oberen Randes des Elements fest. |
border-top-style | Legen Sie den Stil des oberen Randes des Elements fest. |
border-top-width | Legen Sie die Breite des oberen Rands des Elements fest. |
Weitere Programmierkenntnisse finden Sie unter: Programmiervideo! !
Das obige ist der detaillierte Inhalt vonSo legen Sie die Grenzlinie von HTML-Div fest. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!