[Puce] équivalent html ?

J'ai une mise en forme de texte à réaliser sur une page html, le fichier word comporte des puces, en forme de triangle (cf. image).

J'aimerais savoir s'il existe un code équivalent, ou un bidouillage permettant de faire des "puces" de ce type.

Voici l'image :

http://img100.imageshack.us/img100/652/sanstitrelz2.png

Je ne pense pas qu'on puisse personnaliser directement des puces en html (mais je me trompe peut-être :aie: )

Perso, je ferais du style :

Html :

Code:

---

1 2	<p class="puce">Texte</p>

---

Css :

Code:

---

1 2 3 4 5 6 7 8

<style type="text/css"> .puce { background: transparent url('img/test.gif') no-repeat scroll top left; padding: 0px 0px 0px 20px; } </style>

---

Mais il doit sûrement y avoir d'autres possibilités... ;)

Citation:

---

Envoyé par HiRoN

Mais il doit sûrement y avoir d'autres possibilités... ;)

---

Non les puces ne sont pas personnalisables via CSS donc il n'y a que cette possibilité ;)

Mais tu as des valeurs en trop et des éléments à ajouter:

Code:

---

1 2 3 4 5 6 7 8

<style type="text/css" media="screen"> <!-- .puce { background: url(img/test.gif) no-repeat 0 50%; padding-left: 20px; } --> </style>

---

Pour que la puce se place toujours au centre quelque soit la taille du texte, il faudra ajouter un positionnement vertical de la puce en % ou em (entre 40 et 60% le plus souvent).

Salut,

C'est possible de personnaliser ses puces.

Code:

---

list-style-image: url("images/puce.png");

---

oui, mais apparemment cette solution pose des soucis de positionnement de l'image entre les différents navigateurs.

à tester/vérifier.

Citation:

---

Envoyé par tim974

Salut,
C'est possible de personnaliser ses puces.

---

En gros ça revient au même que le background mais en moins intéressant.
Ce que je voulais dire c'est que les puce prédéfinies (square...) ne sont pas personnalisables

Donc je suis obligé de passer par un fichier image ?

Ah oui, il existe une série de puces prédéfinies, mais si tu en veux d'autres, il faut passer obligatoirement par un fichier externe

Citation:

---

Envoyé par razorlok

Donc je suis obligé de passer par un fichier image ?

---

Oui il n'existe pas de puce arrow.

Hum, je vais devoir me traficoter une image alors.