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

uso de la IA en BTOB

Impacto de la IA en un negocio (real y cuantificado): el caso de BTOB

Las principales noticias sobre la inteligencia artificial giran en torno a las numerosas aplicaciones que han salido al mercado para una amplia variedad de sectores. Sin embargo, pocas hablan del verdadero impacto de la IA en un negocio. El ejemplo de BTOB puede aclarar muchas dudas sobre la influencia que tiene la nueva tecnología en

Suite VIsual de Canva

Suite Visual 2.0 de Canva: el mayor lanzamiento en la historia de la plataforma

Canva ha dejado de ser solo una plataforma de diseño gráfico accesible. En su última edición del evento Canva Create, celebrado en Los Ángeles, la compañía australiana ha anunciado el lanzamiento de su mayor revolución tecnológica hasta la fecha: la Suite Visual 2.0 de Canva, un paquete de herramientas que promete transformar la manera en

IA de WordPress

Con la IA de WordPress nunca fue tan sencillo crear una página web

WordPress, quizás la plataforma más popular para crear webs de forma profesional, acaba de dar un paso muy importante: la IA de WordPress ha sido presentada con el objetivo de generar páginas de una forma muy sencilla. Si ya era fácil construir una página web en este ecosistema, ahora lo será mucho más. Todo se

Kings League Clash of Captains

La fructífera relación entre la Kings League Spain y el mundo del gaming

Lo que comenzó como una liga de fútbol 7 reinventada por streamers y exfutbolistas, se ha convertido en un fenómeno de entretenimiento que trasciende el césped. La Kings League Spain, conocida por romper moldes y conectar con las nuevas generaciones a través del deporte y el contenido digital, ha estrechado lazos muy fuertes con el