简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
Heim > Web-Frontend > H5-Tutorial > Hauptteil

Wie zentriere ich das HTML5-Haupt-Tag? Ein Beispiel für die Zentrierung des Haupt-Tags

寻∝梦
Freigeben： 2018-08-31 14:02:20
Original
4911 Leute haben es durchsucht

In diesem Artikel wird hauptsächlich die Zentrierung des HTML5-Haupttags vorgestellt. Es gibt vollständige Anwendungsbeispiele für den Haupttag. Schauen wir uns nun diese Einführung zum HTML5-Haupttag an.

Schauen wir uns an, wie man das HTML5-Haupt-Tag zentriert:

Der Inhalt des

-Elements sollte für das Dokument eindeutig sein. Es sollte keine Inhalte enthalten, die im gesamten Dokument wiederholt vorkommen, z. B. Seitenleisten, Navigationsleisten, Copyright-Informationen, Website-Logos oder Suchformulare.

Hinweis: In einem Dokument kann nicht mehr als ein

-Element vorkommen. Das
-Element darf kein Nachkomme von
,

Nachdem wir so viele Definitionen gesagt haben, werfen wir einen Blick auf das vollständige Codebeispiel für die Zentrierung des Haupt-Tags: 

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>PHP中文网</title>
</head>
<body>
<main align="center">
  <h1>PHP中文网</h1>
  <p>Google Chrome、Firefox 以及 Internet Explorer 是目前最流行的浏览器。</p>
  <article>
    <h1>Google Chrome</h1>
    <p>Google Chrome是由Google开发的一款免费的开源web浏览器，于2008年发布。</p>
  </article>
  <article>
    <h1>Internet Explorer</h1>
    <p>Internet Explorer由微软开发的一款免费的web浏览器，发布于1995年。</p>
  </article>
  <article>
    <h1>Mozilla Firefox</h1>
    <p>Firefox是一款来自Mozilla的免费开源web浏览器，发布于2004年。</p>
  </article>
</main>
</body>
</html>
Nach dem Login kopieren

Ich habe dem Haupt-Tag ein align-Attribut hinzugefügt. Das heißt: Richten Sie das gesamte Dokument in der Mitte aus und sehen Sie sich den im Browser angezeigten Effekt an:

Wie zentriere ich das HTML5-Haupt-Tag? Ein Beispiel für die Zentrierung des Haupt-Tags

Sie können es deutlich sehen, da die Größe des Artikels nicht zu groß sein darf Die Webseite kann nur verkleinert werden, der Text in der Mitte dieser Bilder ist aber noch deutlich zu erkennen.

Okay, dieser Artikel endet hier (wenn Sie mehr erfahren möchten, besuchen Sie die chinesische PHP-Website, durchsuchen Sie die chinesische PHP-Website auf Baidu, dort finden Sie die gewünschten Programmierkurse und Materialien), falls Sie welche haben Fragen Sie können unten Fragen stellen

[Empfehlung des Herausgebers]

Wie entferne ich die Beschriftung vom OL-Tag in HTML? Zusammenfassung zur Verwendung von


    Wie entferne ich den Punkt aus dem ul-Tag in HTML? Stilinstanzanalyse einer ungeordneten HTML-Liste

    Das obige ist der detaillierte Inhalt vonWie zentriere ich das HTML5-Haupt-Tag? Ein Beispiel für die Zentrierung des Haupt-Tags. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

    Verwandte Etiketten：
    align html main
    Quelle：php.cn
    Vorheriger Artikel：Was ist Leinwand-Offscreen-Technologie? Wie erzielt man einen Leinwand-Lupeneffekt? Nächster Artikel：Was sind die neuen Funktionen von HTML5? Zusammenfassung der neuen Funktionen von HTML5
    Erklärung dieser Website
    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
    Neueste Artikel des Autors
    Aktuelle Ausgaben
    So lösen Sie das mysteriöse Leerzeichen am unteren Rand der Seite in CSS Ich versuche, mit Bootstrap und D3 eine einfache Webseite zu erstellen, weiß aber nicht, w...
    Aus 2024-04-06 20:22:15
    0
    1
    454
    Bild- und Namensposition korrigieren Ich versuche, eine Website zu codieren, aber das Bild und der Name (Administracija) ersche...
    Aus 2024-04-05 10:41:36
    0
    1
    3578
    Eine erzwungene Aktualisierung ist eine Folge des Zugriffs auf undefinierte Pfade oder Fehlerseiten in Next.js Der Zugriff auf einen undefinierten Pfad oder eine Fehlerseite führt dazu, dass Next.js ei...
    Aus 2024-04-05 08:32:46
    0
    1
    400
    Die Listenelementsymbole (<ul> und <ol>) im Stammknoten können in CSS nicht angezeigt und entfernt werden, und das Problem overflow-x:hidden kann nicht entfernt werden. Ich arbeite gerade an einer Webseite und habe Probleme mit meinen Listenelementen. Die Pun...
    Aus 2024-04-04 16:38:22
    0
    1
    3617
    Vanilla JS setTimeout(): Falsches Verhalten identifizieren Ich habe eine Animation auf meinem Hamburger-Menü, die in HTML, CSS und Vanilla-JavaScript...
    Aus 2024-04-02 20:44:40
    0
    1
    284
    verwandte Themen
    Mehr>
    Beliebte Empfehlungen
    Beliebte Tutorials
    Mehr>
    Verwandte Tutorials
    Beliebte Empfehlungen
    Aktuelle Kurse
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website：Online-PHP-Schulung für das Gemeinwohl，Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln！