-Tags definiert.
Fußzeilenelemente können innerhalb von , , , , , , oder im verwendet werden ;. Es wird immer innerhalb des platziert. Etikett. Es ist in den einzelnen Blöcken enthalten. Fußzeilen-Tag in HTML, das verwendet wird, um den Fußzeilenteil der Webseite oder eines beliebigen Abschnitts anzuzeigen. Funktioniert nicht als Abschnittselement und erstellt daher keinen neuen Abschnitt in der Gliederung.
Syntax für
<footer>
<p>Some text</p>
</footer>
Nach dem Login kopieren
tag kann innerhalb von dargestellt werden. Tag mit eingeschlossen Tag mit Text darin, den wir im Fußzeilenbereich anzeigen werden. ist eines der nützlichsten Elemente innerhalb der HTML5-Webseite oder für ein anderes HTML-Dokument. Es wird als Teil einzelner Blöcke betrachtet. HTML Es gibt keine spezielle Attributliste, aber es unterstützt auch alle globalen Attribute wie Zugriffsschlüssel, Daten, Klasse, inhaltsbearbeitbar, Verzeichnis, ziehbar, versteckt, ID, Sprache, Dropzone, Rechtschreibprüfung, Stil, Titel, Übersetzung usw als Ereignisattribute wie onafterprint, onbeforeprint, onbeforeunload, onerror, onload, onhashchange, onmessage, onoffline, onpopstate, onstorage, onresize usw.
Beispiele für Footer-Tags in HTML
Es gibt mehrere Möglichkeiten, Fußzeilen in HTML-Dokumente einzufügen; Sehen wir uns einige davon einzeln an:
Beispiel #1
Fügen Sie einfach Tag im Hauptteil des Webdokuments wie.
HTML-Code:
<h2> Footer Example </h2>
<footer>
<p>Published by EDUCBA</p>
<p>Contact us: <a href="%E2%80%9Dmailto:%5Bemail%C2%A0protected%5D%E2%80%9D"> <u> Fußzeilen-Tag in HTML US </u> </a>
</p></footer>
Nach dem Login kopieren
Ausgabe:
Beispiel #2
Footer-Objekt wird verwendet, um das reparativste HTML-Element darzustellen, d. h. Element. Der Zugriff kann über getElementById(); erfolgen. Dieses Beispiel zeigt, wie man über das Objekt auf die Fußzeile zugreift und wie man ein neues Objekt erstellt, um auf Fußzeilendaten zuzugreifen.
HTML-Code:
<h3>Footer Object Example </h3>
<footer id="footerDemo">
<p>all rights reserved @ EDUCBA </p>
</footer>
<p>Press button to check footer section.</p>
<button onclick=" footerFunction()">Click Me</button>
<p id="footerobject"></p>
<script>
function footerFunction() {
var f = document.getElementById("footerDemo").innerHTML;
document.getElementById(" footerobject ").innerHTML = f;
}
</script>
Nach dem Login kopieren
Ausgabe:
Beispiel #3
Im Folgenden finden Sie ein Beispiel für die Daten, die Urheberrechtsinformationen enthalten.
HTML-Code:
<style type="text/css">
#shareicons img {
width: 50px;
padding: 10px;
display: inline;
}
</style>
<h1>Uday Wire Industries</h1>
<h4> <u> About US </u> </h4>
<p>We provide all types of HB wires in different size 5.5 mm , 6.5 mm , 7 mm , 8 mm , 12mm.All those wires drawn from the machines which works on new latest technology for producing best quality of HB wires. Those are kinds of raw material which is going to be useful for various wire industries , Cement pipe making industries ,for nails manufacturing industries and many other industries in the market. Nails also in various sizes 1/10' , 1.5/10' , 2/10' , 2.5/10' , 3/10' 4/10 etc. We are dealing with wire rods and cut rods also. Binding wires also with various different types.</p> <h4>Our Specialty</h4>
Nach dem Login kopieren
Good quality
Smooth Wire rods
perfect coil bundle
No cut rods in coil
coils in small size packaging bundle
Please send us Your requirements to us .So we can give best to You!
Share on
Uday wire Industries
All rights reserved @Uday wire Industries
Ausgabe:
Beispiel #4
Im Folgenden finden Sie ein Beispiel für eine feste Fußzeile.
HTML-Code:
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
.footerdemo {
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color:blanchedalmond;
color: black;
text-align: left;
}
</style>
<img src="img.jpg" style="max-width:90%" alt="Fußzeilen-Tag in HTML" >
<div class="footerdemo">
<h4>About US</h4>
<ul>
<li> <a href="#"> Home </a> </li>
<li> <a href="#"> About </a> </li>
<li> <a href="#"> Career </a> </li>
<li> <a href="#"> Contact US </a> </li>
<li> <a href="#"> Visit Here </a> </li>
</ul>
</div>
Nach dem Login kopieren
Ausgabe:
Beispiel #5
Im Beispiel unten wird die Fußzeile verwendet, um Urheberrechtshinweise anzuzeigen.
HTML-Code:
<meta name="viewport" content="width=device-width, initial-scale=1">
<style>
* {
box-sizing: border-box;
}
.header {
background-color:aliceblue;
padding: 10px;
text-align: center;
}
.part {
float: left;
width: 25%;
padding: 10px;
}
.footer{
position: fixed;
left: 0;
bottom: 0;
width: 100%;
background-color:darkgoldenrod;
}
</style>
<div class="header">
<h1>Latest Technology trends in market </h1>
</div>
<div class="row">
<div class="part">
<h2>Robotic Process Automation</h2>
<p>RPA is latest trending technology which is automating jobs. It deals with the software to automate business methodologies like processingtransactions, replying to the emails, iterpreting with data etc.</p>
</div>
<div class="part">
<h2>Machine Learing</h2>
<p>Machine learing is the process considered as subset of Artificial Intelligence.Its based on neural networks, deep learing and natural language processing (NLP)</p>
</div>
<div class="part">
<h2>Artificial Intelligence</h2>
<p>One of the fastest growing technology is AI, which is based on system which built human intelligence to perform tasks. It helps to complete tasks more perfectly and in short time than humans. </p>
</div>
<div class="part">
<h2>BlockChain</h2>
<p>blockchain is trendy technology in upcoming days for maintaining transactions with encrypted and decentralized nature. Here you are going to make chain of data, so there is no need to trust on third party.</p>
</div>
</div> <br>
<div class="footer">
<h4>All rights reserved @Techpanda 2019</h4>
</div>
Nach dem Login kopieren
Ausgabe:
Fazit
So können wir vermeiden, dass die Fußzeile zur Anzeige von Autoreninformationen, Urheberrechtsangaben, einigen wichtigen Dingen und anderen Daten verwendet wird. Es muss immer im Körperbereich platziert werden. In Dokumenten kann mehr als eine Fußzeile verwendet werden.
