elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Trabajando con las ramas de git (tercera parte)


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  [Resuelto] Colorear sólo los puntos de un "<ul>"
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: [Resuelto] Colorear sólo los puntos de un "<ul>"  (Leído 17,428 veces)
luchi

Desconectado Desconectado

Mensajes: 71


Ver Perfil
[Resuelto] Colorear sólo los puntos de un "<ul>"
« en: 1 Abril 2015, 01:48 am »

Hola a todos.
si yo tengo una lista, por ejemplo:
Código
  1. <div id="elementos">
  2. <ul>
  3.    <li>Elemento 1</li>
  4.    <li>Elemento 2</li>
  5. </ul>
  6. </div>
  7.  
¿Cómo se colorearían sólo los puntos de la lista con CSS? Sólo los puntos, no el texto.
Gracias.


« Última modificación: 3 Abril 2015, 08:32 am por #!drvy » En línea

exploiterstack

Desconectado Desconectado

Mensajes: 102


Ver Perfil
Re: Colorear sólo los puntos de un "<ul>"
« Respuesta #1 en: 1 Abril 2015, 08:40 am »

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
  1. <style type="text/css">
  2. li{
  3.        color: #ff6600;
  4. }
  5. li span{
  6. color: blue;
  7. }
  8. </style>
  9.  

Código HTML:

Código
  1. <div id="elementos">
  2. <ul>
  3. <li><span>Elemento 1</span></li>
  4. <li><span>Elemento 2</span></li>
  5. <li><span>Elemento 3</span></li>
  6. <li><span>Elemento 4</span></li>
  7. <li><span>Elemento 5</span></li>
  8. </ul>
  9.  

Espero haberte ayudado, un saludo! ;)


« Última modificación: 1 Abril 2015, 08:56 am por exploiterstack » En línea

Usuario Invitado


Desconectado Desconectado

Mensajes: 625



Ver Perfil
Re: Colorear sólo los puntos de un "<ul>"
« Respuesta #2 en: 1 Abril 2015, 14:33 pm »

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.
« Última modificación: 1 Abril 2015, 14:37 pm por Gus Garsaky » En línea

"La vida es muy peligrosa. No por las personas que hacen el mal, si no por las que se sientan a ver lo que pasa." Albert Einstein
luchi

Desconectado Desconectado

Mensajes: 71


Ver Perfil
Re: Colorear sólo los puntos de un "<ul>"
« Respuesta #3 en: 2 Abril 2015, 22:46 pm »

Gracias a los dos. Solucionado.
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines