Ir directamente al contenido de esta página
quotes
y algunos valores de content
Las imágenes ilustrativas con capturas de los ejemplos tal y como los presenta Firefox 2; haciendo clic sobre ellas se puede acceder al documento de prueba. El soporte de contenidos generados por medio de CSS varía en diversos navegadores. Para las propiedades y valores que ejemplifico aquí, mis pruebas dan una tabla de resultados que incluyo al final del documento.
Para probar los valores de quotes
y demás, he creado una página con una cita, según este modelo:
<blockquote cite="url_de_la_cita">
<p>texto <q>cita_anidada</q> texto</p>
<p><cite>autor, <i>obra</i></cite></p>
</blockquote>
Le he aplicado las siguientes reglas:
blockquote p:first-child{
quotes:"«" "»" "“" "”";
}
blockquote p:first-child:before{
content:open-quote;
}
blockquote p:first-child:after{
content:close-quote;
}
blockquote:after{
content:"\A [Fuente: "attr(cite)"]";
}
cite{
font-style:normal;
}
Ahora, antes de comprobar el documento en un navegador, repasemos los resultados teóricos que tendrían que tener las reglas según la especificación:
blockquote p:first-child{ quotes:"«" "»" "“" "”"; }
: El párrafo que sea el primer hijo del bloque de cita debería presentar comillas latinas, y si aparece un elemento de cita anidado en él, este segundo debe presentar comillas inglesas. Sin embargo, quotes
no genera las comillas, sólo especifica su tipo en caso de que estas se generen, bien porque el agente de usuario las aplique por defecto —como por ejemplo para el elemento q
—, o que se asignen por medio de content
.blockquote p:first-child:before{ content:open-quote; }
y blockquote p:first-child:after{ content:close-quote; }
: Respectivamente, especifican que para el primer párrafo de deben generar comillas antes y después de su texto.blockquote:after{ content:"\A [Fuente: "attr(cite)"]"; }
: Genera tras el bloque de cita un texto que indica el URL del documento empleado como fuente, recogido en el atributo cite
. Incluyo un escape, \A
, que es la manera de insertar un salto de línea (inglés).Así, el resultado correcto sería éste:
Ahora vamos probar una pequeña variante, que consiste en eliminar las comillas del párrafo, de esta manera:
blockquote p:first-child:before{
content:no-open-quote;
}
blockquote p:first-child:after{
content:no-close-quote;
}
El resultado debería ser éste:
A título personal, creo que al eliminar las comillas del primer elemento, en tipo debería aplicarse en cascada a los niveles adicionales de citas, es decir, que si desaparece la comilla latina del primer nivel debería aplicarse al segundo nivel, la especificada para el segundo a un hipotético tercero, y así sucesivamente. No obstante, este comportamiento no aparece recogido en la especificación, por lo que Firefox —en esta prueba— se comporta de acuerdo con el estándar.
Y ahora es cuando comprobamos el soporte de estas propiedades:
Explorer 6 | Explorer 7 | Firefox 2 | Opera 9 | Safari 3 beta | |
---|---|---|---|---|---|
quotes |
No | No | Sí | Sí | No |
open-quote |
No | No | Sí | Sí | No |
close-quote |
No | No | Sí | Sí | No |
no-open-quote |
No | No | Sí | Sí | No |
no-close-quote |
No | No | Sí | Sí | No |
attr() |
No | No | Sí | Sí | Sí, pero... |
En el caso de Explorer, el navegador no soporta quotes
ni los valores de content
asociados; para attr()
, sin embargo, no puedo hacer una afirmación rotunda, puesto que es difícil comprobarlo cuando lo que no soportan las dos versiones son los pseudoselectores :before
y :after
.
El comportamiento de la beta de Safari es, cuando menos, peculiar para este ejemplo. Aunque he comprobado que este navegador soporta :before
y :after
, y también attr()
, la generar el contenido del atributo no lo sitúa tras el elemento blockquote
, sino tras su primer hijo:
No obstante, hay que tener en cuenta que se trata de una beta, concretamente —en el momento en que escribo esto— la 3.0.4 (523.15).
(cc) CodexExempla.org, 2007–2024 Mapa del sitio | XHTML | CSS | AA