Balise de pied de page en HTML

Le pied de page représente les données liées à l'auteur, les données contenant des informations sur les droits d'auteur ou certains liens liés à ces données. Les informations sur l'auteur incluses dans élément. Ce type de balise connue sous le nom de balise en HTML. La balise de pied de page en HTML est définie dans la balise

On peut utiliser l'élément de pied de page dans

, ,

,

,

,

,

ou sur la

étiqueter. Il est inclus dans les blocs individuels. Balise de pied de page en HTML utilisée pour afficher la partie pied de page de la page Web ou de n'importe quelle section. ne fonctionne pas comme élément de section et ne crée donc pas de nouvelle section dans le plan.

Syntaxe pour Étiquette :

<footer>
<p>Some text</p>
</footer>

• la balise peut être représentée dans balise entourée de

  –

  balise contenant du texte que nous allons afficher dans la section de pied de page.
• est l'un des éléments les plus utiles de la page Web HTML5 ou d'un autre document HTML. Il est considéré comme faisant partie de blocs individuels.
• HTML n'a pas de type spécial de liste d'attributs, mais il prend en charge tous les attributs globaux tels que accesskey, data, class, contenteditable, dir, draggable, Hidden, id, lang, dropzone, orthographe, style, titre, traduction, etc. comme attributs d'événement comme onafterprint, onbeforeprint, onbeforeunload, onerror, onload, onhashchange, onmessage, onoffline, onpopstate, onstorage, onresize, etc.

Exemples de balise de pied de page en HTML

Il existe plusieurs façons d'inclure un pied de page dans les documents HTML ; voyons quelques-uns d'entre eux un par un :

Exemple n°1

Incluez simplement balise à l’intérieur du corps du document Web comme.

Code HTML :

<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> Balise de pied de page en HTML US </u> </a>
</p></footer>

Sortie :

Exemple n°2

L'objet Footer est utilisé pour représenter l'élément HTML le plus réparateur, c'est-à-dire

élément. Il est possible d'y accéder via getElementById();. Cet exemple illustre comment accéder au pied de page via l'objet ainsi que comment créer un nouvel objet pour accéder aux données du pied de page.

Code HTML :

<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>

Sortie :

Exemple #3

Voici un exemple de données contenant des informations sur les droits d'auteur.

Code HTML :

<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>

• 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!
Thank You !

Share on

Uday wire Industries
Shed No. 5 , 6, 7 ,8
Industrial  Area, MIDC Sector
Pune.

All rights reserved @Uday wire Industries

Sortie :

Exemple n°4

Voici un exemple de pied de page fixe.

Code HTML : 

<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="Balise de pied de page en 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>

Sortie :

Exemple #5

Dans l'exemple ci-dessous, le pied de page est utilisé pour afficher les éléments relatifs aux droits d'auteur.

Code HTML :

<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>

Sortie :

Conclusion

Ainsi, nous pouvons surmonter le fait que le pied de page est utilisé pour afficher des informations sur les auteurs, des éléments de droits d'auteur, certaines choses importantes et d'autres données. Il doit toujours être placé dans la section du corps. On peut utiliser plus d'un pied de page dans les documents.

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!