Foros del Web » Creando para Internet » CSS »

seleccionando elementos

Estas en el tema de seleccionando elementos en el foro de CSS en Foros del Web. hola a todos!! la verdad que llevo tiempo diseñando webs pero hasta ahora no me ha surgido una duda. Estoy intentando elegir que el primer ...
  #1 (permalink)  
Antiguo 10/10/2009, 22:52
 
Fecha de Ingreso: junio-2002
Mensajes: 321
Antigüedad: 15 años, 5 meses
Puntos: 3
seleccionando elementos

hola a todos!!

la verdad que llevo tiempo diseñando webs pero hasta ahora no me ha surgido una duda.

Estoy intentando elegir que el primer P dentro de una capa sea de un color diferente.

llevo un buen rato pero no lo consigo, aqui va el codigo:

Código:
<div id="father">
  <h3 class="title">title of content</h3>
  <ul class="options">
    <li><a href="#option-1" title="option 1" target="_self">option 1</a></li>
    <li><a href="#option-2" title="option 2" target="_self">option 2</a></li>
  </ul>
  <div class="clear"></div>
  <p>Aenean massa enim, placerat at malesuada in, feugiat ac augue. Mauris quis augue eget quam iaculis feugiat in sit amet quam. Proin iaculis rutrum iaculis. Praesent tincidunt tempor facilisis. Proin adipiscing convallis ipsum. Fusce tincidunt ornare tellus, at congue sem laoreet et. Quisque tempor rutrum diam, sed ornare quam cursus luctus. Phasellus et purus nec nunc dignissim fermentum sed sit amet arcu. Praesent arcu nisl, eleifend non adipiscing vel, faucibus ac ante. Quisque nisl arcu, pulvinar sit amet congue quis, aliquet in lorem. Sed et nibh non libero fermentum suscipit et at diam. Etiam neque dui, porttitor quis convallis ac, venenatis a nunc. Etiam ipsum dui, malesuada venenatis convallis sed, posuere quis odio. In ut purus non magna egestas ultrices. Aliquam fringilla consectetur dolor vel varius. Nunc non enim orci. Pellentesque facilisis, leo eget gravida luctus, neque sapien iaculis erat, ut cursus nisi est ac erat. Fusce egestas placerat justo sagittis elementum.</p>
  <p>Sed fringilla, enim in imperdiet posuere, nisi leo imperdiet enim, non tempor magna enim sed arcu. Praesent consectetur ipsum nec leo aliquam quis viverra urna accumsan. Nam et quam tellus. Nam posuere enim eu nibh lacinia sodales. Integer quis justo suscipit odio pretium ornare. Cras mollis justo non dui tempus semper. Etiam condimentum, dui sed feugiat pellentesque, nunc lorem convallis odio, quis congue libero elit non metus. Nam nunc sapien, tempus sit amet laoreet ac, pretium tristique neque. Mauris convallis laoreet nunc. Nulla lectus tellus, malesuada nec vulputate eget, lobortis quis diam.</p>
  <p>Nam vitae volutpat tellus. Mauris lobortis, lacus et consequat blandit, risus eros ultrices est, quis convallis quam augue a mi. Cras fringilla nunc nec nisl aliquet aliquet. Suspendisse eros nunc, faucibus vel venenatis in, pharetra sit amet risus. Integer metus quam, faucibus molestie tristique a, tristique eu eros. In eros sem, porttitor quis ultrices sit amet, posuere vitae lectus. Sed in felis justo, ultrices elementum lorem. Pellentesque gravida vestibulum justo cursus aliquet. Nam vitae nisl erat, sit amet lacinia metus. Cras interdum rhoncus dapibus. Morbi non dui est. Sed in commodo lectus. Cras luctus urna a tellus volutpat egestas. Sed ut leo urna. Vestibulum non enim ante, vel tincidunt mauris. </p>
  </div>
viendo documentaciones veo que esta la siguiente opcion: p:first-child, pero por mucho que lo declaro y le pongo un color diferente, no funciona.

lo puse así:
Código:
#father p:first-child {
color:blue;
}
pero no funciona

¿alguna ayudita al respecto?

gracias
  #2 (permalink)  
Antiguo 11/10/2009, 02:28
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: seleccionando elementos

Saludos!

Y si creas un estilo para esa <p>? Quedaria algo asi:

Código HTML:
Ver original
  1. <div class="clear"></div>
  2. <p class="primero">Aenean massa enim, placerat at malesuada in, feugiat ac augue. Mauris quis augue</p>
  3. <p>Sed fringilla, enim in imperdiet posuere, nisi leo imperdiet enim, non tempor magna</p>
  4. <p>Sed fringilla, enim in imperdiet posuere, nisi leo imperdiet enim, non tempor magna</p>
  5.  </div>

Código CSS:
Ver original
  1. .primero {
  2. color: blue;
  3. }

Eso siempre funciona...

Hata Luego!
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
  #3 (permalink)  
Antiguo 11/10/2009, 06:46
 
Fecha de Ingreso: junio-2002
Mensajes: 321
Antigüedad: 15 años, 5 meses
Puntos: 3
Respuesta: seleccionando elementos

Cita:
Iniciado por CaLiZzZ Ver Mensaje
Saludos!

Y si creas un estilo para esa <p>? Quedaria algo asi:

Código HTML:
Ver original
  1. <div class="clear"></div>
  2. <p class="primero">Aenean massa enim, placerat at malesuada in, feugiat ac augue. Mauris quis augue</p>
  3. <p>Sed fringilla, enim in imperdiet posuere, nisi leo imperdiet enim, non tempor magna</p>
  4. <p>Sed fringilla, enim in imperdiet posuere, nisi leo imperdiet enim, non tempor magna</p>
  5.  </div>

Código CSS:
Ver original
  1. .primero {
  2. color: blue;
  3. }

Eso siempre funciona...

Hata Luego!

Siempre es una opcion, pero yo lo hacia porque queria hacer un experimento con mootools para que me pusiera las etiquetas segun mis indicaciones.
  #4 (permalink)  
Antiguo 11/10/2009, 17:15
Colaborador
 
Fecha de Ingreso: junio-2007
Mensajes: 5.798
Antigüedad: 10 años, 6 meses
Puntos: 538
Respuesta: seleccionando elementos

Si no fuese por ie6 (como no podría ser de otra manera), se me ocurre que podrías elegir entre varias formas:
Uso de pseudoclases como ":nth-child()"
o utilizar alguno de los selectores 'avanzados' "~" o "+"

Puedes ver más información al respecto aquí

Un saludo
__________________
Por una web con mucho estilo
+++ CUENTA ABANDONADA. ¿la quieres? +++
  #5 (permalink)  
Antiguo 11/10/2009, 18:11
Avatar de Mikmoro
Colaborador
 
Fecha de Ingreso: octubre-2006
Ubicación: K-pax
Mensajes: 7.228
Antigüedad: 11 años, 2 meses
Puntos: 279
Respuesta: seleccionando elementos

Cita:
Iniciado por Nateskin Ver Mensaje
Siempre es una opcion, pero yo lo hacia porque queria hacer un experimento con mootools para que me pusiera las etiquetas segun mis indicaciones.
Pues si usas mootools, yo seguiría por el camino de javascript para seleccionar el primer elemento P.

Si no, puedes probar con esto:

.clear + p {
color:blue;
}

(obviando a IE6, claro).
__________________
Visita mi nueva web idplus.org
  #6 (permalink)  
Antiguo 11/10/2009, 21:41
Avatar de Calizman
Organiza competencias CSS
 
Fecha de Ingreso: octubre-2008
Ubicación: Ciudad de Guatemala, Guatemala
Mensajes: 1.122
Antigüedad: 9 años, 2 meses
Puntos: 83
Respuesta: seleccionando elementos

Al final de cuentas... sin complicarte la vida y aceptando la facilidad de la misma... Utiliza una clase no?
__________________
[ Mi Sitio Personal ]
"La felicidad no es una estacion de llegada... Es un modo de viajar"
Tom Schreiter
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 20:45.