Comment dessiner une ligne en pointillés avec css ?

Question

Comment puis-je dessiner une ligne en pointillés avec css ? J'ai cherché mais je n'ai pas trouvé.

merci

Answer 1

Par exemple :

hr {
  border-top: 1px dotted #f00;
  color: #fff;
  background-color: #fff;
  height: 1px;
  width:50%;
}

Voir aussi Styling <hr> avec CSS .

Answer 2

<style>
    .dotted {border: 1px dotted #ff0000; border-style: none none dotted; color: #fff; background-color: #fff; }
</style>
<hr class='dotted' />

Answer 3

J'ai trouvé la réponse aquí en utilisant la recherche Google "css lignes pointillées" :

<div class="horizontal_dotted_line"></div>

et dans styles.css :

.horizontal_dotted_line{
  border-bottom: 1px dotted [color];
  width: [put your width here]px;
}

Answer 4

La réponse acceptée comporte de nombreux éléments qui ne sont plus nécessaires pour les navigateurs modernes. J'ai personnellement testé le CSS suivant sur tous les navigateurs, jusqu'à IE8, et il fonctionne parfaitement.

 hr {
    border: none;
    border-top: 1px dotted black;
  }

border: none doit venir en premier, afin de supprimer toutes les bordures par défaut que les navigateurs appliquent à l'image de l'utilisateur. hr tags.

Answer 5

Cette ligne devrait fonctionner pour vous :

<hr style="border-top: 2px dotted black"/>