Foro de elhacker.net

Programación => Desarrollo Web => Mensaje iniciado por: franfis en 16 Mayo 2013, 00:17 am

Título: como seleccionar en css
Publicado por: franfis en 16 Mayo 2013, 00:17 am

Hola amigos. En el siguiente html

Código:

<p><a href="#">Enlace</a></p>
<p><span><a href="#">Enlace</a></span></p>

el código:

Código:

p a { color: red; }

Pone de color rojo los dos enlaces

Código:

p * a { color: red; }

Pone de color rojo solo el segundo enlace.
Pero como hago para hacer referencia solo al primer enlace. :huh:

Título: Re: como seleccionar en css
Publicado por: Shell Root en 16 Mayo 2013, 00:26 am

Código

p:first-child a{ color:#FF0000; }

Título: Re: como seleccionar en css
Publicado por: franfis en 16 Mayo 2013, 00:38 am

Digamos que, ¿Y si tengo?

Código:

<p><a href="#">Enlace</a></p>
<p><span><a href="#">Enlace1</a></span></p>
<p><span><a href="#">Enlace2</a></span></p>
<p><span><a href="#">Enlace3</a></span></p>
<p><span><a href="#">Enlace4</a></span></p>
  .
  .
  .
<p><span><a href="#">Enlace30</a></span></p>

Como selecciono los 30 enlaces? Gracias

Título: Re: como seleccionar en css
Publicado por: Shell Root en 16 Mayo 2013, 00:45 am

Como dijistes que sólo al primero...

Código

p{ padding:0; margin:0; }
p a[href]{ color:#FF0000; }

Título: Re: como seleccionar en css
Publicado por: franfis en 16 Mayo 2013, 01:12 am

Hola Shell Root, perdona me equivoqué queria decir: 30 enlaces del primer tipo sin seleccionar el "Ultimo" así:

Código:

<p><a href="#">Enlace1</a></p>
<p><a href="#">Enlace2</a></p>
<p><a href="#">Enlace3</a></p>
<p><a href="#">Enlace4</a></p>
  .
  .
  .
<p><a href="#">Enlace30</a></p>
<p><span><a href="#">Ultimo</a></span></p>

Gracias por la paciencia. Saludos

Título: Re: como seleccionar en css
Publicado por: #!drvy en 16 Mayo 2013, 01:35 am

Tal y como lo has puesto... puedes aprovechar el span a tu favor..

Código

p > a {background:#000; color:#aaa;}

Esto lo que hace es seleccionar solo los <a> que sean hijos directos de los <p>.

Saludos