Easy-Micro

ESPACEMEMBRE XML
XML et HTML

Du HTML dans du XML

Pour insérer du HTML dans un document XML, on procède avec un name space (un espace de nom) pour les balises HTML. L' attribut d'espace de nom xmlns (xml name space) permet d'éviter les double-sens sur des noms de balises déja utilisées (voir l'atelier XHTML).

Exemple d'un document XML (mapage.xml):
<?xml version="1.0" encoding="iso-8859-1"?>
<mondocument xmlns:html="http://www.w3.org/TR/REC-html40">
<question>Le XML est-il compatible EASY-MICRO ? </question>
</mondocument>

Explication: La première ligne correspond au prologue qui introduit un document Xml. La deuxième ligne introduit la balise appelée ici "mondocument" contenant la définition de l'espace de nom et son adresse (respectez l'adresse du lien!).

Jusque là, cela reste du XML, il suffit maintenant d'introduire des balises html sous la forme: <html:nom de balise> et si besoin </html:nom de balise>

Exemple avec la balise paragraphe: <html:p>... le texte ...</html:p>
Exemple avec la balise titre 1: <html:h1>... le titre ...</html:h1>
Exemple avec la balise ligne horizontale: <html:hr/>

Exemple d'un document XML avec du Html (mapage.xml):
<?xml version="1.0" encoding="iso-8859-1"?>
<mondocument xmlns:html="http://www.w3.org/TR/REC-html40">
<question>Le <html:b>XML</html:b> est-il compatible avec <html:b>EASY-MICRO</html:b> ? </question>
</mondocument>

Explication: Le code supplémentaire n'ajoute ici que du gras (balise b pour bold en anglais) sur les deux mots 'XML' et 'EASY-MICRO'.

Si la stucture arborescente est toujours visible dans Internet Explorer, voici l'astuce pour forcer le navigateur à afficher correctement le HTML. Ajoutez un lien vers un fichier de feuilles de style CSS ! Le fichier ne doit même pas être créé, il suffit d'indiquer n'importe quel nom avec l'extention .css.

<?xml-stylesheet href="pasvrai.css" type="text/css"?>
Placez cette ligne juste sous le prologue et avant la déclaration de l'élément racine (nommé ici 'document').

Exemple d'un document XML avec du Html et un faux appel de CSS (mapage.xml):
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet href="pasvrai.css" type="text/css"?>
<mondocument xmlns:html="http://www.w3.org/TR/REC-html40">
<question>Le <html:b>XML</html:b> est-il compatible <html:b>EASY-MICRO</html:b> ? </question>
</mondocument>

Mise en page XML
La mise en page XML est ici réalisée via le langage de feuilles de style en cascade: le CSS (Cascading StyleSheet -> voir l'atelier "CSS"). Mais la mise en page XML est surtout réalisée via le langage de feuilles de style étendu: le XSL (eXtended Stylesheet Language), sujet de l'atelier "XSL".

Création du fichier CSS: Créez un nouveau document avec le bloc note et enregistrez le sous le nom 'monstyle.css'. Placez-y la ligne suivante:
mondocument { font-family: Verdana, Arial, serif; font-size:10pt; color:#000099; }
Placer un lien vers ce fichier CSS comme l'exemple ci-dessus (avec pasvrai.css).

Exemple d'un document XML avec du Html et appel de CSS (mapage.xml):
<?xml version="1.0" encoding="iso-8859-1"?>
<?xml-stylesheet href="monstyle.css" type="text/css"?>
<mondocument xmlns:html="http://www.w3.org/TR/REC-html40">
<question>Le <html:b>XML</html:b> est-il compatible <html:b>EASY-MICRO</html:b>?</question></mondocument>

Then, you can read your nice xml web page: voir le résultat de cet exemple !
See you soon for another EASY-MICRO cute lecon on XSL ! (Découvrez le XSL !)


< Page précédente XML Page suivante >