Présentation

En HTML on cherche parfois des solutions pour créer des objets spécifiques qui s’afficheront à l’écran.

Cette page recueille d’éventuels essais que j’aurai pu faire à ce sujet.

Barre de progression

Compatible avec plusieurs navigateurs :

<style>
progress {
width: 50%;
margin-left: 25px;;
background-color: #ddd;
}

progress:after {
content: attr(value);
}
</style>

et :

<p>
<progress id="post-migration" value="60" max="100">60%</progress>
<span id="migrationBar">60%</span>
</p>

Barre remplie :

<p>
<progress id="migration" value="100" max="100">100%</progress>
<span id="migrationBar">100%</span>
</p>