el párrafo primero ¿Por qué no tomar este estilo p:first-child¿Por qué el primer párrafo no toma este estilo p: primer hijo?
#content p:first-child {color:#4C4C4C;
font-size:1.2em;
font-weight:bold;
line-height:1.8;
margin-bottom:0.5em;}
<div id="content">
<h1>Welcome</h1>
<p>first paragraph</p>
<p>second paragraph</p>
<p>third paragraph</p>
</div>
Cómo seleccionar el párrafo primero de css?
Si bien las respuestas anteriores ya han definido el problema (que el p no es el primer hijo de los padres div), he aquí una solución a su problema, para apuntar el primer p que sigue a un h1, dependiendo de su navegador :
h1 + p { /* styles any paragraph that immediately follows a h1 element */ }
Muy buen punto. Si tiene suerte, eso funcionará para él en todos los ámbitos. +1 –
Bueno, este parece ser el mejor método de pure-css; aunque obviamente aplicar una clase de '.first' (o lo que sea) al primer párrafo es más compatible con varios navegadores. La compatibilidad parece estar bien (para casi todos excepto IE6, con algunos problemas para IE7 e IE8 * como * IE7): http://quirksmode.org/css/contents.html –
El selector coincide con cualquier elemento p que sea el primer elemento secundario de su elemento principal.
En este caso, el p es el segundo hijo de su padre.
Tenga una mirada en: http://www.w3schools.com/CSS/css_pseudo_classes.asp
el contenido de P no es su primer hijo - por lo que he visto una etiqueta o como sería el primer hijo, no el contenido real.
Usted está buscando el selector pseudo :first-of-type! Así, haría esto para conseguir ese primer párrafo:
#content p:first-of-type
siempre se puede simplemente asignar una clase a cada párrafo primero - prueba plena.
p.indent{
text-indent:50px;
}
Causa IE no me gusta pseudo elementos – Luis