Analyse des Ausschnitts des Hintergrundbildes des Neunerrasters mit adaptiver Breite und Höhe

<br />Basierend auf dem ursprünglichen, in Breite und Höhe adaptiven Neuner-Raster-Layout haben wir einige Optimierungen vorgenommen und acht Hintergrundbildanforderungen in eine geändert, um die Netzwerkkosten zu senken. Tatsächlich sind dies nur einige einfache Tipps. Wenn Sie beim Zuschneiden von Bildern sehr streng sind, treten bei einer 1-Pixel-Asymmetrie Probleme auf. Bitte beachten Sie die Zuschneideanalyse des folgenden Beispiels.
RAR: modul.zip
Anweisungen :
Bildschnittanalyse

Der Schlüssel besteht darin, ein teilweise transparentes Hintergrundbild zu verwenden und ein zusätzliches <SPAN>-Tag hinzuzufügen, um den Hintergrund für jeden adaptiv erweiterten XHTML-Teil zu lesen, um so den erweiterten Hintergrund links oder rechts oder oben und unten versetzt auszufüllen. Um das Problem zu lösen, dass der IE keine 100 % Höhe erreicht, werden die Höhen der linken und rechten Erweiterung als absolute Werteinheiten von 3000 Pixeln geschrieben (je nach Bedarf angepasst).
Manko :
Das Hintergrundbild muss transparent sein, daher können Bilder im JPG-Format nicht verwendet werden. (Ich hoffe, jemand kann dieses Problem lösen)

Schritt-für-Schritt-Anleitung zur Installation von VMware Workstation und des Betriebssystems WIN10 zur Verbindung mit dem externen Netzwerk (sehr ausführliches Tutorial)

Artikel

Analyse des Ausschnitts des Hintergrundbildes des Neunerrasters mit adaptiver Breite und Höhe

So entfernen Sie MySQL aus Ubuntu und installieren es neu

HTML implementiert die Funktion zur Erkennung der Eingabevervollständigung

Detaillierte Erläuterung der Startreihenfolge des Docker-Containers mithilfe eines Shell-Skripts

So verwenden Sie Nginx zum Simulieren der Canary-Freigabe

Schritt-für-Schritt-Anleitung zur Installation von VMware Workstation und des Betriebssystems WIN10 zur Verbindung mit dem externen Netzwerk (sehr ausführliches Tutorial)

Detaillierte Erläuterung der kombinierten MySQL-Indexmethode

Detaillierte Erläuterung der CentOS-Konfiguration der offiziellen Nginx-Yum-Quelle

MySQL-Reihe: Grundlegende Konzepte der relationalen MySQL-Datenbank

html öffnet ein neues Fenster mit einem Hyperlink und kann Fenstereigenschaften steuern

Grundlegende Syntax des MySQL-Index

Artikel empfehlen

Dieser Artikel fasst die spezifische Verwendung des CSS-Zweispaltenlayouts und des Dreispaltenlayouts zusammen

Detaillierte Erklärung des Unterschieds und der Verwendung von Anführungszeichen und Backticks in MySQL

Installieren von Alibaba Cloud Server mit Docker und die Fallstricke bei der Installation in einer virtuellen Maschine (Zusammenfassung der Probleme)

Über das WeChat-Gleitproblem des UniApp-Editors

Gogs+Jenkins+Docker automatisierte Bereitstellung von .NetCore-Schritten

Details zum JavaScript-Abschluss

CentOS8-Netzwerkkarten-Konfigurationsdatei

5 JavaScript-Möglichkeiten zum Abflachen von Arrays

Bedeutung und Verwendung einer Linux-CD

Installieren Sie Zookeeper unter Docker (Standalone und Cluster).

Lösung zur Installation von Vim im Docker-Container

Mehrere Möglichkeiten, Bilder in React-Projekte einzuführen

CSS sorgt dafür, dass der untergeordnete Container das übergeordnete Element übersteigt (der untergeordnete Container schwebt im übergeordneten Container).

So starten und stoppen Sie das Shell-Skript zur Bereitstellung eines SpringBoot-JAR-Programms unter Linux

So installieren und konfigurieren Sie MySQL 5.7.19 unter CentOS 6.5