Comment dessiner une forme d`étoile en utilisant css

Vous pouvez créer une forme d`étoile avec seulement quelques lignes de code CSS.

Vous pouvez faire une forme d`étoile avec seulement quelques lignes de code dans une feuille de style en cascade (CSS), plutôt que d`utiliser un fichier image pour transmettre la forme d`une page Web. charges de code CSS plus rapide que d`une image, ce qui améliore l`expérience de site pour vos visiteurs. Il est également très facile de changer les couleurs et les proportions de la forme lorsque vous utilisez CSS, car il ne nécessite pas de logiciel de retouche d`image.


L`étoile à six faces est la forme d`étoile la plus facile de créer en CSS, car il est composé de deux triangles.

Choses que vous devez

  • Plaine éditeur de texte
  • Ouvrez un document HTML.

  • Dans la section du document HTML, insérez le code suivant:

  • Créer un élément appelé "triangle plan," à l`intérieur de la section du document HTML. Définir les propriétés de bordure, la largeur et la position de l`élément pour créer un triangle. Par exemple, pour créer un triangle qui est de 80 pixels (px) de large et 60px de haut, insérez le code suivant:

    Triangle-up {
    Border-color: transparent transparent # 000000 transparent;

    Border-style: solide;




    border-width: 0px 40px 60px 40px;

    largeur: 0px;

    position: absolute;

    top: 0px;

    }

  • Créer un élément appelé "triangle vers le bas" dans la partie du document HTML. Ce triangle doit être une image miroir de la "triangle plan," élément. Le code ressemblera à ceci:

    triangle vers le bas {
    border-color: # 000000 transparent transparent transparent;

    Border-style: solide;

    border-width: 60px 40px 0px 40px;

    largeur: 0px;

    position: absolute;

    top: 35px;

    }

  • Insérez le code suivant dans la section du document HTML:

  • Enregistrez votre document HTML et l`ouvrir dans un navigateur pour voir le résultat final.

AUTRES

» » » » Comment dessiner une forme d`étoile en utilisant css