Beschreibung des hr-Tags in verschiedenen Browsern

Im Allgemeinen treffen wir die Personalabteilung nur selten, aber wenn es soweit ist, kann dies über Leben und Tod entscheiden. Dasselbe gilt für HTML. Wir sehen <hr /> nicht sehr oft, aber wenn wir es sehen, bestimmt es normalerweise, ob wir einen perfekten Teiler haben können. Ich werde hier keine Bilder anhängen, sondern sie nur als Referenz auflisten:

	Normaler Browser	IE6, 7	Feuerfuchs
Tatsächliche Höhe	Höhe + Rahmen-rechts-Breite + Rahmen-links-Breite	Höhe	Höhe
Hintergrundfarbe	Hintergrundfarbe	Hintergrund + Farbe (wenn die Höhe <2 Pixel beträgt, wird die Höhe als graue Projektion angezeigt und die Farbe muss festgelegt werden, genau wie beim Text)	Hintergrundfarbe

Wenn Sie beispielsweise eine Trennlinie mit einer tatsächlichen Höhe von 3 Pixeln, vier Seiten von 1 Pixeln, einer Rahmenfarbe von #07f und anderen Teilen der Farbe #f60 erstellen möchten, wissen Sie:

Code kopieren

Der Code lautet wie folgt:

hr{
Höhe: 1px;
*Höhe: 3px; Farbe: #f60;/* für IE6 IE7 */;
Hintergrundfarbe: #f60;
Rand: 1px durchgezogen #07f;
}
@-moz-document url-prefix(){ hr{height:3px;}} /* für Firefox */

Gibt es andere, weniger aufwändige Lösungen?

<<: Detaillierte Erläuterung der Position der CSS-Sticky-Positionierung: Sticky-Problemgrube

>>: Perfekte Lösung für das Zeitzonenproblem des Docker Alpine-Image

Verwaltung von xinetd-basierten Diensten, die mit RPM-Paketen in Linux installiert wurden

Beschreibung des hr-Tags in verschiedenen Browsern

Verwaltung von xinetd-basierten Diensten, die mit RPM-Paketen in Linux installiert wurden

Podman bootet den Container automatisch und vergleicht ihn mit Docker

So implementieren Sie den Nginx-Reverse-Proxy für mehrere Server

Lösung für das Problem von var in einer for-Schleife

So verteilen Sie mit CSS zwei Schaltflächen auf der linken und rechten Seite desselben übergeordneten Tags

So erstellen Sie ein Apache-Image mit Dockerfile

MySQL 5.7.20 Green Edition Installation Detailliertes grafisches Tutorial

5 JavaScript-Möglichkeiten zum Abflachen von Arrays

Implementierungscode zum Betreiben einer MySQL-Datenbank in Golang

Verwenden Sie JavaScript, um Seiteneffekte zu erstellen

Artikel empfehlen

So stellen Sie die MySQL5.7-Kodierung auf utf8mb4 ein

Erläuterung der Faktoren, die die Datenbankleistung in MySQL beeinflussen

Tutorial zur Installation der Dekomprimierungsversion von MySQL 8.0.12

Beispielcode zum Vergleich verschiedener Syntaxformate von vue3

Centos7 Zabbix3.4-E-Mail-Alarmkonfiguration (Lösung des Problems, dass der E-Mail-Inhalt ein xx.bin-Anhang ist)

Der Unterschied zwischen HTML Empty Link href="#" und href="javascript:void(0)"

Tutorial zu HTML-Tabellen-Tags (8): Hintergrundbild-Attribut BACKGROUND

Sperrt Mysql ALTER TABLE die Tabelle beim Hinzufügen von Feldern?

Detaillierte Erklärung dieser Zeigerfunktion in JS

Beispiel für das Hoch- und Herunterladen von Dateien im Front-End mit Vue+Express

Beispiel einer DOM-Operationstabelle (DOM erstellt Tabelle)

So verwenden Sie Vue3-Mixin

TypeScript-Aufzählungstypen im Detail erklären

Zusammenfassung zum horizontal scrollenden Website-Design

Eine kurze Analyse des Zustandsverständnisses von React