Erfahrung im Selbststudium von CSS-Optimierungsfähigkeiten
|
1. Verwenden Sie CSS-Sprites. Der Vorteil besteht darin, dass die in CSS verwendeten kleinen Bilder zu einem großen Bild zusammengeführt werden können, was die Anfragen an den Server reduziert, den Serverdruck verringert und das Laden der Seite beschleunigt. 2. Mehrere CSS-Dateien zu einer einzigen CSS-Datei zusammenführen. Dieselben Vorteile wie CSS-Sprites 3. Verwenden Sie externes CSS. Externes CSS kann von Browsern zwischengespeichert werden und ist einfach zu pflegen. 4. Fügen Sie das CSS in den Kopf ein. Sie können sich auf das Dokument von Yahoo beziehen: http://developer.yahoo.com/performance/rules.html#css_top 5. Link statt Import verwenden Die Verwendung des Imports verlangsamt das Laden der Seite. Darüber hinaus kann die Ladereihenfolge im Internet Explorer von den Erwartungen abweichen, was direkt zu Anzeigeproblemen führt. 6. Verwenden Sie CSS-Abkürzungen. Verwenden Sie beispielsweise „margin“ statt „margin-top“. 7. Kombinieren Sie ähnliche Stile, um Wiederholungen zu vermeiden. 8. Reduzieren Sie Zeilenumbrüche. 9. Löschen Sie das letzte Semikolon. 10. Verwenden Sie einzeilige Kommentare. 11. RGB-Farbabkürzung. 12. Entfernen Sie unnötige Einheiten wie z. B. px. 13. Löschen Sie nicht verwendete Stile. Dadurch kann die Dateigröße verringert und die zum Parsen und Abgleichen des Browsers benötigte Zeit verkürzt werden. 14. Komprimieren Sie CSS-Dateien. Alle oben genannten Punkte sind sehr einfach und müssen nicht im Detail erklärt werden. Natürlich verfügen einige CSS-Komprimierungstools über Optimierungsfunktionen. |
<<: Detaillierte Erläuterung der CSS-Randüberlappung und Lösungssuche
Artikel empfehlen
Detaillierte Erläuterung der MySQL-Mehrtabellenabfrage
Sich gut zu ernähren und ausreichend zu schlafen,...
Eine Liste der Fallstricke beim regulären JS-Matching
Ich habe vor Kurzem eine Falle bei der regulären ...
So entwerfen und optimieren Sie MySQL-Indizes
Inhaltsverzeichnis Was ist ein Index? Prinzip der...
Detaillierte Erklärung der Beziehung zwischen React und Redux
Inhaltsverzeichnis 1. Die Beziehung zwischen Redu...
Ein Vergleich zwischen dem href-Attribut und dem onclick-Ereignis des a-Tags
Lassen Sie uns zunächst über die Ausführungsreihe...
So verwenden Sie die Clipboard-API in JS
Inhaltsverzeichnis 1. Document.execCommand()-Meth...
So entfernen Sie Inline-Stile, die durch das Stilattribut (element.style) definiert sind
Wenn Sie Magento häufig ändern, stoßen Sie möglich...
Detaillierte Bereitstellung von Docker+Gitlab+Gitlab-Runner
Umfeld Server: centos7 Kunde: Fenster Stellen Sie...
So verwenden Sie CSS, um je nach Unterelementen unterschiedliche Stile zu schreiben
Der Effekt, den wir erreichen müssen: Was wird be...
Ändern Sie die Dateiberechtigungen (Eigentum) unter Linux
Linux und Unix sind Mehrbenutzer-Betriebssysteme,...
Implementierung der MySQL-Tabellenlöschoperation (Unterschiede zwischen Löschen, Abschneiden und Löschen)
In diesem Artikel werden hauptsächlich die Unters...
Beispiel für die Anzeige von Bildjalousien mit reinem CSS
Lassen Sie mich Ihnen zunächst den fertigen Effek...
Umfassende Übersicht über die verschiedenen Abhörmethoden von Vue3.0
Inhaltsverzeichnis Hörer 1.Uhreneffekt 2.Uhr 1.1 ...
Bei verschachtelten MySQL-Transaktionen aufgetretene Probleme
MySQL unterstützt verschachtelte Transaktionen, a...
Zusammenfassung gängiger Befehle zum Erstellen von ZooKeeper3.4-Middleware unter CentOS7
1. Herunterladen und entpacken 1. Einführung in Z...