10/01/2021

XML AVEC CSS

Said BAHASSINE
S.bahassine2@gmail.com/

XML TRANSFORMATION
Utiliser un CSS pour formater un contenu XML

Xml sans css

Xml in editor
Xml in navigator

Xml avec css

1
 10/01/2021

XML TRANSFORMATION
Utiliser un CSS pour formater un contenu XML

 À l'aide de feuilles de style CSS, il est possible de formater des

éléments HTML (h1, div, href, span, …)

 Il est aussi possible de réaliser le même formatage pour des

éléments d’un document XML, peut importe le nom de ces
éléments.

 L’incorporation d’un CSS dans un XML se fait de la même façon

que dans un HTML

XML TRANSFORMATION
Utiliser un CSS pour formater un contenu XML
<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css" href="biblio.css"?>
<bibliotheque>
<livre>
<titre>1984</titre>
<auteur>
<nom>Orwell</nom> <bibliotheque>
<prenom>George</prenom> <livre>
</auteur> <titre>
<ref>Fiction-O-1</ref> <auteur>
</livre> <nom>
<livre> <prenom>
<titre>N ou M</titre> <ref>
<auteur>
<nom>Christie</nom>
<prenom>Agatha</prenom>
</auteur>
<ref>Policier-C-15</ref>
</livre>
</bibliotheque>

2
 10/01/2021

body
{
background-color: #ffffff;
color: #000000;
}
balise1{
display:block;
margin-left:10pt;
margin-bottom:5pt;
font-size:12pt
}
balise2{
margin-right:10pt;
color:blue;
}
balise3{
margin-right:10pt;
}
balise4{ color:red; }

body
{
background-color: #ffffff;
color: #000000;
}
livre{
display:block;
margin-left:10pt;
margin-bottom:5pt;
font-size:12pt
}
titre{
margin-right:10pt;
color:blue;
}
auteur{
margin-right:10pt;
}
ref{ color:red; }

3
 10/01/2021

Syntaxe

Balise

Exemple
livre{
color: blue;
margin-left:10pt;
font-size:12pt
}

Un récapitulatif des propriétés CSS les plus courantes :

Clause Valeur
Font-family Verdana, Geneva …
Font-size Elle s'exprime en %, ou en pixels (la plus utilisée)
Font-style 3 valeurs aux choix : italic, oblique, normal (par
défaut).
Color black, blue, red, pink, white, ...), le code
hexadécimal du type #91c225 (permet toutes les
couleurs) ou le code RGB rgb(145,194,37).
Background-color Couleur d’arrière plan

Margin marges extérieures à l'élément concerné,

Padding identique à la précédente, margin, mais cette fois
les marges sont appliquées à l'intérieur de
l'élément concerné.

4
 10/01/2021

https://www.w3schools.com/css/default.asp

Le CSS en 3 questions/réponses - en bref

C'est quoi HTML et CSS ?

Le CSS est un langage informatique utilisé pour mettre en forme les fichiers
HTML sur un site web. Ainsi, les fichiers CSS permettent de gérer l'aspect
graphique d'une page en HTML.

Qu'est-ce que le CSS ?

CSS est l'acronyme de « Cascading Style Sheets » c'est à dire « feuille de style
en cascade ». Le CSS est un langage informatique permettant de mettre en
forme des pages web (HTML ou XML).

Différence entre CSS et CSS3 ?

CSS3 est la dernière version de CSS. Il fournit des capacités de type JavaScript.
En plus de cela, il fournit également des fonctionnalités de développement
mobile.

10

5
 10/01/2021

11