4.6 Eine horizontale Trennlinie anpassen

Problem

Das Aussehen der horizontalen Trennlinie in Abbildung 4-12 soll in etwas Interessanteres geändert werden, beispielsweise in das kleine zentrierte Rechteck aus Abbildung 4-13.

Lösung

Verwenden Sie den CSS-Selektor hr, und kombinieren Sie verschiedene CSS-Eigenschaften, um den gewünschten Effekt zu erzielen:

hr {
 margin-left: auto;
 margin-right: auto;
 margin-top: 1.25em;
 margin-bottom: 1.25em;
 width: 10px;
 height: 10px;
 background-color: #777;
}
Standarddarstellung einer horizontalen Trennlinie

Abbildung 4-12. Standarddarstellung einer horizontalen Trennlinie

Abbildung 4-13. Horizontale Trennlinie mit Stildefinitionen

Diskussion

Vor HTML 4.0 war es möglich, ...

Get CSS Kochbuch now with the O’Reilly learning platform.

O’Reilly members experience books, live events, courses curated by job role, and more from O’Reilly and nearly 200 top publishers.

Start your free trial