2012-01-25 10 views
37

Tengo a: antes para una 'cita' de apertura y una: después para una cotización de cierre.Pseudo-elementos de anidamiento dentro de pseudo-elementos

Ahora lo que quiero es un: after: after para la referencia 'cite' pero no puedo hacer que funcione.

¿Alguien sabe si esto es posible?

Mi código hasta ahora: -

blockquote:before { content: '\201C'; } 
blockquote:after { content: '\201D'; } 

blockquote { 
    font-size: 22px; 
    line-height: 24px; 
    text-indent:60px; 
} 
blockquote:before { 
    font-size: 170px; 
    margin-left: -136px; 
    margin-top: 50px; 
    opacity: 0.2; 
    position: absolute; 
    overflow:visible; 
    float:left; 
    width:135px; 
} 
blockquote:after { 
    float: right; 
    font-size: 170px; 
    margin-right: 35px; 
    margin-top: 33px; 
    opacity: 0.2; 
    overflow:visible; 
    width:135px; 
} 
blockquote[cite]:after:after { 
    display: block; 
    text-align: right; 
    content: "\2014\ " attr(cite); 
    font-style: normal; 
    font-size: 0.8em; 
    } 

Respuesta

39

La idea de anidación ::before y ::after pseudo-elementos se ha propuesto; ver this section del módulo Contenido generado y reemplazado. Sin embargo, ese módulo ha sido abandonado pending a complete rewrite, por lo que no me quedaría sin aliento en este documento que alguna vez recibiría la implementación hasta que se vuelva a publicar. Y aun así, aún no se sabe si los pseudo-elementos de anidación seguirán siendo una cosa.

+3

Ahh bien, lástima :( –

+1

@BoltClock ¿Alguna actualización sobre esto? –

+4

@Zeaklous: No, este documento en particular se puede considerar abandonado ya que está pendiente una reescritura completa - ver http://www.w3.org/Style/ CSS/current-work.en.html – BoltClock

Cuestiones relacionadas