Heim > Artikel > Web-Frontend > Wissen Sie, wie man das Footer-Tag in HTML5 verwendet? , was bedeutet das Footer-Tag in HTML5?

Wissen Sie, wie man das Footer-Tag in HTML5 verwendet? , was bedeutet das Footer-Tag in HTML5?

寻∝梦Original: 2018-08-15 15:30:5721495Durchsuche

Wissen Sie, wie man das Footer-Tag in HTML5 verwendet? , was bedeutet das Footer-Tag in HTML5? In diesem Artikel werden Ihnen die Definition und spezifische Verwendung des Fußzeilen-Tags in HTML5 sowie die Standardattribute in der Fußzeile und die einfache Implementierungsmethode für die Platzierung am Ende der Seite vorgestellt.

Die Definition und Verwendung des Fußzeilen-Tags in HTML5:

c37f8231a37e88427e62669260f0074d definiert die Fußzeile eines Abschnitts oder Dokuments.

Normalerweise enthält dieses Element den Namen des Autors, das Datum, an dem das Dokument erstellt wurde, und/oder Kontaktinformationen.

In einem Dokument können mehrere

Beispiel

Dokumentfußzeile:

<footer>This document was written in 2010</footer><!DOCTYPE HTML>
<html>
<body>
<footer>This document was written in 2010.</footer>
</body>
</html>

Unterschiede zwischen HTML 4.01 und HTML 5

c37f8231a37e88427e62669260f0074d Tags sind neue Tags in HTML 5.

Tipp: Wenn Sie eine Fußzeile zum Einfügen von Kontaktinformationen verwenden, sollten Sie das Element 208700f394e4cf40a7aa505373e0130b verwenden.

Standardattribute der Fußzeile in HTML:

Klasse, Inhalt editierbar, Kontextmenü, Verzeichnis, ziehbar, ID, irrelevant,

Sprache, Referenz, Registrierungszeichen , Tabindex, Vorlage, Titel

HTML5-Syntaxstruktur – TOP

1. Fügen Sie id

<</span>footer> 
　　PHP中文网<</span>br /> 
　　学习CSS，找DIV+CSS资源上PHP中文网! 
</</span>footer>

3 zum Fußzeilenelement-Tag hinzu . Fügen Sie die Klasse

<</span>footer id=”abc”> 
　　PHP中文网<</span>br /> 
　　学习CSS，找DIV+CSS资源上PHP中文网! 
</</span>footer>

zum Fußzeilen-Tag hinzu. 4. Wissenserweiterung

Wenn wir das Fußzeilen-Tag in der HTML5-Entwicklung verwenden, können wir es wie ein gewöhnliches div-Tag behandeln, es wird jedoch im Allgemeinen für verwendet das untere Layout der Website. Im Allgemeinen hat eine Webseite nur einen unteren Bereich, daher ist es am besten, die Fußzeile nur einmal zu verwenden.

Hinweis: Es ist neu in HTML5 und nicht mit IE8 und niedriger kompatibel. Verwenden Sie es daher mit Vorsicht.

Ich habe unten auf der Seite im Internet eine einfache Implementierungsmethode gesehen und teile sie jetzt mit Ihnen

Anforderung: Manchmal, wenn der Seiteninhalt kurz ist und die Höhe nicht unterstützen kann des Browsers, aber ich hoffe, dass die Fußzeile am unteren Ende des Fensters sein kann.

Idee: Die Mindesthöhe der übergeordneten Ebene der Fußzeile beträgt 100 %. Die Höhe der Fußzeile muss absolut unten sein (unten: 0). in der übergeordneten Ebene.

HTML-Code:

XML/HTML-Code Inhalt in Zwischenablage kopieren

<</span>footer class=”yanshi”> 
　　PHP中文网<</span>br /> 
　　学习CSS，找DIV+CSS资源上PHP中文网! 
</</span>footer>

CSS lautet wie folgt:

CSS-Code Inhalt in Zwischenablage kopieren

<!-- 父层 -->     
<div id="wapper">     
    <!-- 主要内容 -->     
    <div id="main-content">     
    </div>     
    <!-- 页脚 -->     
    <div id="footer">     
    </div>     
</div>

Zu diesem Zeitpunkt können andere Browser normal angezeigt werden, aber IE 6 muss separat verarbeitet werden:

CSS-Code kopiert den Inhalt in die Zwischenablage

#wapper{     
    position: relative;   /*重要！保证footer是相对于wapper位置绝对*/     
    height: auto;          /* 保证页面能撑开浏览器高度时显示正常*/     
    min-height: 100%  /* IE6不支持，IE6要单独配置*/     
}     
#footer{     
   position: absolute;  bottombottom: 0; /* 关键 */     
   left:0; /* IE下一定要记得 */     
   height: 60px;         /* footer的高度一定要是固定值*/     
}     
#main-content{     
   padding-bottom: 60px; /*重要！给footer预留的空间*/     
}

Okay, dieser Artikel Das ist alles Ich möchte es dir sagen. Der Artikel zum Header wird auch veröffentlicht, ich hoffe, dass jeder reinklickt und reinschaut.

[Verwandte Empfehlungen]

Was sind die Attribute des HTML-IMG-Tags? Verstehen Sie die Verwendung des IMG-Tags

Was ist Web in HTML5? Was sind die Elemente im Webspeicher?

Das obige ist der detaillierte Inhalt vonWissen Sie, wie man das Footer-Tag in HTML5 verwendet? , was bedeutet das Footer-Tag in HTML5?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

html5 css html xml class

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

Vorheriger Artikel：Was ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5?Nächster Artikel：Was ist das Abschnitts-Tag in HTML5? Wie zentriere ich das Abschnitts-Tag in HTML5?

In Verbindung stehende Artikel

Mehr sehen