[Débutant] Mise en forme avec XSL

**sidahmed** · 20/09/2007, 02h17

Bonjour,

où je peux trouver les propriétes de mise en forme d'un document XML à l'aide de XSL, à l'instar du CSS, permettant de colorer des titres, souligner, mettre en gras, mettre en boîte des blocs, insérer des images background, ...etc.

Merci d'avance.

**fraoustin** · 20/09/2007, 09h17

en faite le xsl va permettre de transformer ton fichier xml en fichier xhtml (par exemple) donc soit:
* tu ajoutes dans ton xsl les balises couleurs ...
* tu génères un fichier html et dans lequel tu fait référence à un fichier css

exemple
fichier xml

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
 
<a>
<tutu>titi</tutu>
<tutu>titi</tutu>
<tutu>titi</tutu>
<toto>titi</toto>
</a>

fichier xsl

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
 
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
	<xsl:output 
  		encoding="ISO-8859-15"
  		method="xml"
  		indent="yes" />
 
	<xsl:template match="/">
               <html><body>
			<xsl:apply-templates select="*"/>
		</body></html>
	</xsl:template>
 
	<xsl:template match="tutu">
               <h1 style="color:olive"><xsl:value-of select="."/></h1>
	</xsl:template>
 
	<xsl:template match="toto">
               <h2 style="color:red"><xsl:value-of select="."/></h1>
	</xsl:template>
</xsl:stylesheet>

et la tu obtiens un fichier avec des styles différents
soit

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
 
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
	<xsl:output 
  		encoding="ISO-8859-15"
  		method="xml"
  		indent="yes" />
 
	<xsl:template match="/">
               <html><head>
 
	       <link rel="StyleSheet" href="essai.css" type="text/css">
               </head><body>
			<xsl:apply-templates select="*"/>
		</body></html>
	</xsl:template>
 
	<xsl:template match="tutu">
               <h1 style="color:olive"><xsl:value-of select="."/></h1>
	</xsl:template>
 
	<xsl:template match="toto">
               <h2 style="color:red"><xsl:value-of select="."/></h1>
	</xsl:template>
</xsl:stylesheet>

et tu as un fichier essai.css

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
 
 
h1 { 
color: olive;
}
h2 { 
color: red;
}

je préfère personnellement la deuxième solution (avec css) car comme cela je différencie la mise en forme du contenu (en faite un designer de site peux par la suite intervenir sans modifier la feuille xsl)

**sidahmed** · 20/09/2007, 12h50

Merci fraoustin,

est-ce que je peux utiliser uniquement du XSL pour la mise en forme d'un document XML ? Positionner des blocs, insérer des images background ? Car le travail qui m'a été confié exige le XSL et pas de CSS, je ne crois pas que c'est une bonne solution !!!

Juste une question de validité Xhtml 1.0 : le code écrit, en bleu, est-il obligatoire ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
Document XSL
<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:template match="/">
  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
  ...
  </html>
<xsl:template>
<xsl:stylesheet>

À bientôt.

**Swoög** · 20/09/2007, 15h32

A savoir :

XSLT n'est pas là pour faire de la mise en page... à la base, XSLT est là pour transformer un arbre XML (un document XML) en un autre OU en texte OU en HTML.

Ensuite, pour tout ce qui est mise en page/mise en forme, le CSS est en général nettement mieux adapté

Sinon au niveau du XHTML, oui, le code en bleu est obligatoire d'un point de vue validation, cf la norme XHTML ^^

**sidahmed** · 20/09/2007, 15h52

Merci Swoög,

donc, comment peut-on inclure les deux fichiers XSL et CSS à un document XML ?

**Swoög** · 20/09/2007, 15h57

Pour le CSS, il te suffit d'utiliser :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<?xml-stylesheet type="text/css" href="cd_catalog.css"?>

Pour XSLT :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<?xml-stylesheet type="text/xsl" href="simple.xsl"?>

Il te suffit de mettre la balise qui t'intéresse juste après le prologue XML :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

<?xml version="1.0" ... ?>

Par contre, je doute qu'il soit possible d'utiliser ET un CSS ET un XSLT dans le même XML... (logique puisque les deux ont un impact non compatible sur l'affichage du XML

)

Bonne Continuation

**sidahmed** · 20/09/2007, 16h37

Bonsoir,

on peut écrire ce code ?

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
Document XML
<?xml version="version" encoding="ISO-5988-1" ?>
<?xml-stylesheet type="text/xsl" href="style.xsl"?>
<?xml-stylesheet type="text/css" href="style.css"?>
...

style.xsl : transformer le document XML en XHTML,
style.css : mise en page du document (couleur, mise en valeur, positionnement, mise en boîte, ...etc.)

Sinon, comment dois-je procéder pour réaliser un petit site web statique avec XML en utilisant impérativement le XSL ?

Merci de votre patience.

**sidahmed** · 21/09/2007, 02h16

Bonjour,

pour clore ce sujet, je voudrais savoir une chose : est-il possible de positionner des blocs <div></div> uniquement avec XSL / XSLT ?

Merci d'avance.

**fraoustin** · 21/09/2007, 09h14

oui, il suffit de l'ajouter dans ton code xsl
sinon pour le css si tu as interdiction de l'utiliser ne l'utilise pas , mais sache que ton code sera par la suite plus difficile à maintenir

**sidahmed** · 21/09/2007, 15h49

Bonsoir,

Envoyé par fraoustin

oui, il suffit de l'ajouter dans ton code xsl
sinon pour le css si tu as interdiction de l'utiliser ne l'utilise pas , mais sache que ton code sera par la suite plus difficile à maintenir

Donc, c'est possible d'écrire ça :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
Document XML
<?xml version="version" encoding="ISO-5988-1" ?>
<?xml-stylesheet type="text/xsl" href="style.xsl"?>
<?xml-stylesheet type="text/css" href="style.css"?>
...

**fraoustin** · 24/09/2007, 09h44

en faite en même temps je ne pense pas que oui, mais si tu as un process qui génère ton fichier html rien ne t'empêche d'utiliser par la suite un css

**fraoustin** · 24/09/2007, 09h53

je corrige ma réponse (j'ai chercher car cela me préoccupait)
donc tu a un fichier xml que tu transforme en html (par la naviguateur) via une feuille de style. Dans ta transformation tu génère la balise <link rel="StyleSheet" href="style.css" type="text/css"/> permettant par la suite d'appliquer une feuille de style au html générer

**Morbo** · 24/09/2007, 12h17

J'ai eu pas mal de pb de compatibilité avec les feuilles de style css dans ce cas de figure (en générant la baliser link), notamment avec IE. J'ai pas trouvé de solution élégante.

**sidahmed** · 24/09/2007, 14h57

O.K., merci à vous deux

c'était la balise <link> et non pas <xsl:stylesheet>.

Amicalement.

[Débutant] Mise en forme avec XSL

XSL/XSLT/XPATH XML

Discussions similaires

Partager

Partager