[Resuelto] Colorear sólo los puntos de un "<ul>"

[luchi]

Hola a todos.
si yo tengo una lista, por ejemplo:

Código (html4strict) [Seleccionar] Expandir


<div id="elementos">
<ul>
   <li>Elemento 1</li>
   <li>Elemento 2</li>
</ul>
</div>

¿Cómo se colorearían sólo los puntos de la lista con CSS? Sólo los puntos, no el texto.
Gracias.

[exploiterstack]

Hola que tal luchi,

Me temo que no vas a poder cambiar únicamente el color de los puntos sin que ello quede afectado el color del texto(ya que lo cogería igual)...

Luego a partir de ahí puedes hacer algún que otro truco:

1.    Añadir una imagen como punto en la lista.
2.    Crear un &bull; personalizado.
3.    (La opción mas recomendada) envolver el texto del ítem con una etiqueta span, de modo que aplicas dos reglas: una para el li y otra para el span dentro del li, ejemplo:

Código CSS:

Código (css) [Seleccionar] Expandir


<style type="text/css">
li{
       color: #ff6600;
}
li span{
color: blue;
}
</style>


Código HTML:

Código (html4strict) [Seleccionar] Expandir


<div id="elementos">
<ul>
<li><span>Elemento 1</span></li>
<li><span>Elemento 2</span></li>
<li><span>Elemento 3</span></li>
<li><span>Elemento 4</span></li>
<li><span>Elemento 5</span></li>
</ul>


Espero haberte ayudado, un saludo!

[Usuario Invitado]

Como te dijo exploiterstack, si deseas cambiarle el color a las "bullets" o viñetas, debes de introducir otro elemento dentro de li, ya que es al li al que le asignas un color.cPuedes ver el demo en éste JsFiddle.


Saludos.

[luchi]

Gracias a los dos. Solucionado.