Wie ändere ich die Farbe einer horizontalen HTML-Regel () mithilfe von CSS?

Styling der horizontalen Regel

Während das unten enthaltene Code-Snippet zunächst versucht, die Farbe eines

<hr>-Tags mithilfe von CSS zu ändern, ist dies nicht der Fall beweist erfolglos:

<hr>

hr {
  color: #123455;
}

Lösung

Um die Linienfarbe des

<hr>-Elements zu ändern, sollten Sie die Eigenschaft border-color anstelle von color:

hr {
  border-color: #123455;
}

Beachten Sie jedoch, dass bei einer Änderung der Liniengröße die Rahmenbreite wie im Stil angegeben bleibt, während die Linie selbst kehrt zur Standardfarbe zurück. Daher ist es ratsam, auch die Hintergrundfarbe anzugeben.

Das HTML 5 Boilerplate-Standard-Stylesheet enthält die folgende Regel:

hr {
  display: block;
  height: 1px;
  border: 0;
  border-top: 1px solid #ccc;
  margin: 1em 0;
  padding: 0;
}

Zusätzlich wird in einem Artikel von SitePoint hervorgehoben, dass

erben kann seine Rahmenfarbe vom übergeordneten Element mithilfe der CSS-Eigenschaft border-color: inherit.

<hr>

Das obige ist der detaillierte Inhalt vonWie ändere ich die Farbe einer horizontalen HTML-Regel () mithilfe von CSS?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!