Estilización de documentos XML con CSS

Estilización de documentos XML con CSS

Estilización de documentos XML con CSS

VALORACIÓN DEL ARTÍCULO:
5/5


Crear un documento XML, escribir el DTD y analizarlo con un navegador está bien, pero ¿cómo se mostrará el documento cuando lo vea? XML no es un lenguaje de visualización. De hecho, los documentos escritos con XML no tendrán formato alguno.

Entonces, ¿cómo veo mi XML?

La clave para ver XML en un navegador son las Hojas de Estilo en Cascada. Las hojas de estilo le permiten definir cada aspecto de su documento XML, desde el tamaño y el color de su texto hasta el fondo y la posición de sus objetos no textuales.

Digamos que tienes un documento XML:

 
 
  
  
 
 
  
  /parent>/parent>
 Layard/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre

Si tuviera que ver ese documento en un navegador preparado para XML, como Internet Explorer, mostraría algo como esto:

Judy Layard Jennifer Brendan

Pero, ¿y si quisieras diferenciar entre los elementos padre e hijo? O incluso hacer una distinción visual entre todos los elementos del documento. No se puede hacer eso con XML, y no es un lenguaje que deba utilizarse para la visualización.

Pero afortunadamente, es fácil usar Hojas de Estilo en Cascada, o CSS, en documentos XML para definir cómo quiere que se muestren esos documentos y aplicaciones cuando se visualizan en un navegador. Para el documento anterior, puede definir el estilo de cada una de las etiquetas de la misma manera en que lo haría con un documento HTML.

Por ejemplo, en HTML puede definir todo el texto dentro de las etiquetas de párrafo (

/p>) con la fuente Verdana, Ginebra, o Helvetica y el color de fondo verde. Para definir eso en una hoja de estilo de modo que todos los párrafos sean así, usted escribiría:

Pre>p {

 
 font-family : verdana, geneva, helvetica;
 background-color : #00ff00;
 }

Las mismas reglas funcionan para los documentos XML. Cada etiqueta en XML se puede definir en el documento XML:

familia {

 color : #000000;
 }
 parent {
 font-family : Arial Black;
 color : #ff0000;
 border : solid 5px;
 width : 300px;
 }
 child {
 font-family : verdana, helvetica;
 color : #cc0000;
 border : sólido 5px;
 border-color : #cc0000;
 }

Una vez que tenga su documento XML y su hoja de estilo esté escrita, necesita juntarlos. Similar al comando de enlace en HTML, usted pone una línea en la parte superior de su documento XML (debajo de la declaración XML), diciéndole al analizador XML dónde encontrar la hoja de estilos. Por ejemplo:

Como se ha indicado anteriormente, esta línea se encuentra debajo de la declaración pero antes de cualquiera de los elementos del documento XML.

Poniéndolo todo junto, su documento XML se leería:

 
 
 
  
  
  
 
 
  
  /parent>/parent>
 Layard/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Niño/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre/Padre

TAMBIÉN TE INTERESA

recetas-de-postres

Conviértete en todo un chef con las recetas de cocina de Alexa

El famoso asistente de voz de Amazon puede hacer casi de todo lo que le pidas, incluidas las recetas de cocina de Alexa. Tras cinco años de vida en España, algo más en Estados Unidos, los datos que maneja la compañía indican que muchas personas recurren a Alexa como su ayudante en la cocina, ya

videos-TikTok

TikTok vs. Google: la red social planta cara al buscador rey

Las búsquedas en Internet viven su particular Juego de Tronos. Google siempre ha estado sentado en el Trono de Hierro pero cada vez más familias están pujando por destronar al rey. Sin duda, Microsoft se ha postulado como un digno rival con su navegador Edge y la puesta en marcha de la IA en esta

Zoom-Workplace

Zoom Workplace, la plataforma de trabajo que ha ideado Zoom con base en la IA

En cuestión de cuatro años, Zoom ha pasado de ser una gran desconocida a toda una referencia en el mundo de las comunicaciones. De emerger como herramienta de videollamadas en la pandemia, hoy Zoom se ha convertido en toda una solución multiusos para la vida diaria y el trabajo, cuya culminación se ha traducido con

fusión-Orange-MásMóvil

Orange y MásMóvil: arranca el nuevo gigante de las teleco en España

Orange y MásMóvil han anunciado al fin la formación de su nueva empresa conjunta, completando así el acuerdo para fusionar sus operaciones en España. Tras años de negociación, se ha completado una operación que ha dado lugar a la creación de la mayor operadora de telecomunicaciones en España. Los accionistas de ambas compañías poseen el

Instagram-Creator-Marketplace

España, a la espera del Instagram Creator Marketplace

Instagram es una de las redes sociales de mayor impacto en la población española. Desde su irrupción, la figura del influencer ha crecido enormemente en el mundo del marketing y las marcas. La herramienta Instagram Creator Marketplace puede seguir fortaleciendo a estos prescriptores, visto el potencial que empieza a tener este servicio en Estados Unidos.