Eine neue CSS-Bildersatztechnik (Hintergrundanzeige und Textverschiebung vom Bildschirm), um 9999 Pixeln Lebewohl zu sagen
|
Die -9999-Pixel-Bildersetzungstechnologie ist seit fast einem Jahrzehnt beliebt. Um ein Textelement durch ein Bild zu ersetzen, können Sie den folgenden Code verwenden: Code kopieren Der Code lautet wie folgt:<h1>Dieser Text wurde ersetzt</h1> <Stil> h1 { Hintergrund: URL("meinBild") 0 0 keine Wiederholung; Texteinzug: -9999px; } </Stil> Der Hintergrund des Elements wird angezeigt und sein Text wird aus dem Bildschirm verschoben, damit er nicht stört. Einfach und effektiv. Es wird oft verwendet, um grafische Beschriftungen anzuzeigen. Da es mittlerweile Webfonts gibt, ist dies nur noch selten erforderlich, aber bei der Verwendung im Web ist es dennoch nützlich. Bisher. Eine neue Technologie wurde entdeckt: Code kopieren Der Code lautet wie folgt:{ Texteinzug: 100 %; Leerzeichen: Nowrap; Überlauf: versteckt; } Der Code rückt den Text über die Breite seines Containers hinaus ein, führt jedoch keinen Umbruch durch und der Überlauf wird ausgeblendet. Dies ist zwar etwas länger und schwieriger zu merken, kann aber die Leistung verbessern, da der Browser im Hintergrund kein 9999 Pixel großes Kästchen mehr zeichnet. Durch die Verwendung von ausgeblendetem Text werden außerdem die merkwürdigen, links erweiterten Umrisse verhindert, die Sie um Links herum sehen. |
<<: Einige Möglichkeiten zur Lösung des Problems des in Jenkins integrierten Docker-Plugins
>>: JavaScript implementiert den detaillierten Prozess der Stapelstruktur
Artikel empfehlen
Implementierung der MySQL-Benutzerrechteverwaltung
1. Einführung in MySQL-Berechtigungen Es gibt 4 T...
Einführung in Who-Befehlsbeispiele in Linux
Über wen Zeigt die am System angemeldeten Benutze...
Webdesign-Tutorial (5): Visuelles Webdesign
<br />Vorheriger Artikel: Webdesign-Tutorial...
Ursachen und Lösungen für das Problem des verstümmelten Zeichensatzes in der MySQL-Datenbank
Vorwort Manchmal sehen wir beim Anzeigen von Date...
CSS fixiert das Tag auf Containerebene (div...) an einer Position (ganz rechts auf der Seite)
Der Code sieht folgendermaßen aus: .Verfahren{ Ra...
Reines CSS, um coole Neonlichteffekte zu erzielen (mit Demo)
Ich habe kürzlich die Tutorial-Reihe zu CSS-Anima...
Jedes Mal, wenn Docker einen Container startet, werden die IP und die Hosts mit den angegebenen Operationen
Vorwort Jedes Mal, wenn Sie Docker verwenden, um ...
Zusammenfassung von drei Möglichkeiten zum Implementieren von Rankings in MySQL ohne Verwendung von „order by“
Übernahme des Geschäfts: Sehen Sie sich die Gehal...
Detaillierte Erläuterung der Gründe für die Trennung von JS WebSocket und des Heartbeat-Mechanismus
1. Grund der Sperrung Es gibt viele Gründe, warum...
Vue ElementUI Form-Formularvalidierung
Die Formularvalidierung ist eine der am häufigste...
Detaillierte Erklärung der Docker-Einstiegspunktdatei
Schließen Sie beim Schreiben einer Docker-Datei e...
Der Aufruf der Suchmaschine auf der Seite erfolgt am Beispiel von Baidu
Heute ist mir plötzlich eingefallen, dass es cool ...
So installieren Sie MySQL 5.7.17 und stellen die Kodierung in Windows auf UTF-8 ein
herunterladen Offizieller MySQL-Download, wählen ...
So installieren und konfigurieren Sie Redis in CentOS7
Einführung Es ist nicht nötig, Redis im Detail vo...
Der vollständige Implementierungsprozess von Sudoku mit JavaScript
Inhaltsverzeichnis Vorwort So lösen Sie Sudoku Fü...