Heim  >  Artikel  >  Web-Frontend  >  So realisieren Sie die mobile adaptive Webseitengröße

So realisieren Sie die mobile adaptive Webseitengröße

php中世界最好的语言
php中世界最好的语言Original
2018-02-06 09:35:289729Durchsuche

Dieses Mal werde ich Ihnen zeigen, wie Sie die Größe von mobiltelefonadaptiven Webseiten erkennen und welche Vorsichtsmaßnahmen es gibt, um die Größe von mobiltelefonadaptiven Webseiten zu erkennen. Das Folgende ist ein praktischer Fall: Werfen wir einen Blick darauf.

Für geschäftliche Zwecke muss ich einen Webseiteneffekt erstellen, der sich an Mobiltelefone anpasst. Ich habe ihn endlich verstanden, teile ihn und zeichne ihn zuerst auf!

Tatsächlich besteht die Hauptsache darin, die HTML-Seitendeklaration zu ändern:

Fügen Sie den folgenden Code zur Webseite hinzu, und sie wird normal angezeigt:

<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no, minimum-scale=1.0, maximum-scale=1.0"/>

Erklärung:
width – die Breite des Ansichtsfensters
height – die Höhe des Ansichtsfensters
initial-scale – das anfängliche Zoomverhältnis
minimum-scale – die minimales Verhältnis, auf das der Benutzer zoomen darf
Maximalmaßstab – das maximale Verhältnis, auf das der Benutzer zoomen darf
vom Benutzer skalierbar – ob der Benutzer manuell zoomen kann
Zur Vereinfachung können Sie Änderungen vornehmen Wenn Sie den obigen Code mit dem folgenden Code vergleichen, ist der Effekt derselbe:

<meta content="width=device-width,user-scalable=no" name="viewport">

Stellen Sie zum Beispiel das spezifische Breiten--Attribut nicht zu groß ein Stellen Sie das Breitenattribut des Körpers auf der Webseite auf 1000 Pixel ein. Dies wird definitiv nicht funktionieren, aber Sie können es auf 90 % einstellen. Dies ist bildschirmadaptiv.
PS: Ich habe eine Effektseite erstellt, die normal auf einem Mobiltelefon angezeigt werden kann

Ich glaube, dass Sie die Methode beherrschen, nachdem Sie diese Fälle gelesen haben. Bitte achten Sie darauf zu anderen verwandten Artikeln auf der chinesischen PHP-Website!

Verwandte Lektüre:

So verwenden Sie die horizontale HR-Linie in HTML

So konvertieren Sie Text im Textbereich in HTML. Das ist Wagenrücklauf und Zeilenvorschub

So verwenden Sie Iframe, um andere Webseiten in die aktuelle Webseite einzubetten

Das obige ist der detaillierte Inhalt vonSo realisieren Sie die mobile adaptive Webseitengröße. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn