Comment faire un triangle en CSS ?

L’animation suivante vous présente la méthode à employer pour construire un triangle en utilisant uniquement du HTML et du CSS.

Principe de fonctionnement

Exemple de code

                <div class="triangle"></div>
            

                .triangle {
    width: 0;
    height: 0;
    border: 0 solid transparent;
    border-right-width: 100px;
    border-left-width: 100px;
    border-bottom: 200px solid #000;
}
            

Générateur en ligne

Vous pouvez également trouver des générateurs de triangle CSS en ligne :

• http://apps.eky.hk/css-triangle-generator
• https://outils-css.aliasdmc.fr/generateur-de-triangles-css.php
• https://codepen.io/yukulele/pen/KLnhJ