Implementierungscode zur automatischen Anpassung der Breite der Webseite an die Breite des Handy-Bildschirms (Viewport)

Die allgemeine Schreibweise ist wie folgt:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

< Meta Name = "Ansichtsfenster" Inhalt = "Anfangsmaßstab=1,0" >

Weitere Möglichkeiten zum Schreiben:

XML/HTML-CodeInhalt in die Zwischenablage kopieren

1. < Meta Name = "Ansichtsfenster" Inhalt = "Breite=Gerätebreite, Anfangsmaßstab=1,0, Mindestmaßstab=0,5, Höchstmaßstab=2,0, benutzerdefiniert skalierbar=ja" />

Durch Einfügen des obigen Satzes in den <head> einer Webseite wird die Breite der Webseite automatisch an die Breite des Mobiltelefonbildschirms angepasst.
In:

width=device-width: Gibt an, dass die Breite die Breite des Gerätebildschirms ist
initial-scale=1.0: gibt das anfängliche Skalierungsverhältnis an
minimum-scale=0.5: gibt das minimale Zoomverhältnis an
maximum-scale=2.0: gibt das maximale Zoomverhältnis an
user-scalable=yes: Gibt an, ob der Benutzer das Zoomverhältnis anpassen kann

Wenn Sie die Webseite öffnen möchten, wird sie automatisch in ihren ursprünglichen Proportionen angezeigt und kann von Benutzern nicht geändert werden. Gehen Sie dann wie folgt vor:

Code kopieren

Der Code lautet wie folgt:

Nachdem Sie auf diese Weise geschrieben haben, können Sie die Breite einiger Kopfzeilenbanner und anderer Bilder auf style="width:100%" einstellen, und die gesamte Seite wird auf dem Gerät im Vollbildmodus angezeigt.

<<: So legen Sie die Höhe des automatisch angepassten Textbereichs in Element UI fest

>>: Probleme mit der Rancher-Bereitstellung und dem Importieren von K8S-Clustern

So implementieren Sie Docker Registry zum Erstellen eines privaten Image Warehouse

Implementierungscode zur automatischen Anpassung der Breite der Webseite an die Breite des Handy-Bildschirms (Viewport)

So implementieren Sie Docker Registry zum Erstellen eines privaten Image Warehouse

Detaillierte Analyse des Diff-Algorithmus in React

Beispiel für die Anpassung des Vue-Projekts an den großen Bildschirm

Zabbix kombiniert mit Bat-Skript, um eine Methode zur Überwachung des Anwendungsstatus mehrerer Anwendungen zu erreichen

Schritte zur VSCode-Konfiguration mit der Git-Methode

Rendern im Vue-Scaffolding verstehen

Was bedeutet this.parentNode.parentNode (übergeordneter Knoten des übergeordneten Knotens)?

Analyse des Implementierungsprozesses der Docker-Container-Orchestrierung

Details zur Verwendung von aktiviertem Vue in untergeordneten Komponenten

Kreativer Eröffnungseffekt durch die Kombination von CSS 3.0 mit Video

Artikel empfehlen

JavaScript generiert zufällige Grafiken durch Klicken

Zusammenfassung der Methoden zum Erstellen, Auflisten und Löschen von Docker-Containern unter Linux

JavaScript-Grundlagen: Geltungsbereich

Bildschirmbefehl und Verwendung unter Linux

Zen-Codierung für Editplus – Beispielcodebeschreibung

Detaillierte grafische Erläuterung der Hadoop-Installation und -Konfiguration basierend auf Linux7

Führen Sie die Schritte zum Erstellen einer Laravel-Entwicklungsumgebung mit Docker aus

Drei Arten des HTML+CSS-Layouts (natürliches Layout/fließendes Layout/positioniertes Layout)

So verstecken Sie RAR-Dateien in Bildern

Definition und Funktion des zoom:1-Attributs in CSS

OpenSSL-Zertifikate in der Linux-Umgebung generieren

Detaillierte Erklärung zum Hinzufügen gepunkteter Linien zu Vue-Elementbaum-Steuerelementen

Detaillierte Erläuterung des Prozesses der Zabbix-Überwachung von SQLServer

Detaillierte Erläuterung der Installationsmethode von Mysql 5.7.18 und des Prozesses zum Starten des MySQL-Dienstes

Detaillierte Beschreibung der HTML-Tabellenrahmensteuerung