|
For English version: FoXspeaqsXhtml
@ide-mémoire des codes XHTML valides dans les WiKis WikiNi
pour les p@rticipants, @rtisans, j@rdiniers des WiKis WikiNi.
|
01. (Haut)
02.
03.
04.
Avec , pour allumer l'encodage HTML,
simplement écrire deux paires de guillemets doubles ; voici un guillemet double : "
Tout ce qui se trouve entre ces deux paires
répondra alors à l'encodage HTML,
01. (Haut)
02.
03.
04.
2. Un
WiKi WikiNi est un endroit idéal où se familiariser avec le HTML,
parce qu'
un changement de ligne, en cliquant "Enter", quand on édite en HTML
n'en crée pas un dans la p@ge WiKi publiée, comme c'est le cas
dans plusieurs forums phpBB et blogues, et aussi, avec le
FoXmatageWikiNi FoXmattinG :
conséquemment,
chaque balise HTML peut avoir sa propre ligne,
sans pour autant créer une ligne vide dans la p@ge publiée.
Le code XHTML <br /> crée un changement de ligne :
ainsi, à l'édition d'une p@ge
WiKi,
que l'on écrive
(entre des paires de guillemets doubles, au lieu d'un seul ")
- "voici la première ligne<br />et voici la deuxième,"
ou bien
|
ou encore
|
"
voici la première ligne<br />
et voici la deuxième,
"
| "
voici la première ligne
<br />
et voici la deuxième,
"
|
dans la p@ge WiKi publiée, on lira :
|
Voici la première ligne et voici la deuxième.
|
01. (Haut)
02.
03.
04.
3. Pour changer de ligne entre deux paires de guillemets doubles, on peut utiliser le code <br /> ;
les codes ~ <hr /> ~ <div align="x"> ~ <blockquote> ~ <table> ~ <h1> à <h7> ~
- créent eux aussi un changement de ligne.
Notez qu'avec le HTML 4.0 transitionnel, excepté pour les trois codes
<br>, <hr> et <img src="URL_@ddress of Im@ge">,
- les autres codes HTML doivent tous être fermés :
- par exemple, la balise <b>, pour les caractères gras, est fermée par la balise </b>
Notez également qu'avec le XHTML 1.0 transitionnel,
- tous les codes XHTML doivent être fermés,
- incluant <br />, <hr />, <img src="URL_@ddress of Im@ge" alt="compulsory" />,
lesquels sont fermés à l'intérieur même de leur balise d'ouverture, avec un espace et une barre oblique.
Notez aussi qu'avec le code
img, l'attribut "
alt" est obligatoire, en XHTML 1.0.
01. (Haut)
02.
03.
04.
4. Prendre également note que lorsqu'on utilise ensemble plusieurs
codes,
- qu'on devrait les refermer dans l'ordre inverse de leur entrée :
par exemple, si on met le texte en retrait, et qu'on le justifie et le colore en bleu, on écrit,
- avec WikiNi, entre deux paires de guillemets doubles,
<blockquote>
<div align="justify">
<font color="#3333ff">
avant le texte, puis, on ferme les balises dans l'ordre inverse de leurs entrées:
</font>
</div>
</blockquote>
Un autre exemple
<b><i><u>Texte gras, italique, souligné.</u></i></b> =
Texte gras, italique, souligné.
a. Pour les caractères
Gras
Avec
WikiNi, entre deux paires de guillemets doubles,
écrire <b>avant le texte et</b> après.
Équivalent en FoXmatageWikiNi FoXmattinG : **Gras** = Gras
b.
Pour les caractères en italique
Avec
WikiNi, entre deux paires de guillemets doubles,
écrire <i>avant le texte et</i> après.
Équivalent en FoXmatageWikiNi FoXmattinG : //Italique// = Italique
c.
Pour les caractères soulignés
Avec
WikiNi, entre deux paires de guillemets doubles,
écrire <u>avant le texte et</u> après.
Équivalent en FoXmatageWikiNi FoXmattinG : __Souligné__ = Souligné
d.
Pour "effacer" du texte
Avec
WikiNi, entre deux paires de guillemets doubles,
écrire <s>avant le texte et</s> après.
Équivalent en FoXmatageWikiNi FoXmattinG : @@biffé@@ = biffé
e.
Police Couleurs
Types
Formats
Surlignage
Pas d'équivalent en FoXmatageWikiNi FoXmattinG, sauf ici.
Pour colorer un texte court, écrire
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"<font color="#009900">au choix, avant le texte vert et après : </font>
"
donnera
au choix, avant le texte vert et après :
Pour
les textes plus longs, donner une ligne à chaque balise et écrire, au choix,
"
<font color="#009900">
avant le texte,
qui répondra au HTML,
et après :
</font>
"
|
"<font color="#009900">"
avant le texte,
qui ici répond au
FoXmatageWikiNi FoXmattinG,
et après :
"</font>"
|
Police Couleurs
Types
Formats
Surlignage
Avec
WikiNi, entre deux paires de guillemets doubles,
- ces attributs <font face> créent ce qui suit :
<font face="comic sans ms">Exemple Comic Sans MS.</font> =
Exemple Comic Sans MS.
<font face="arial"><b>Exemple Bold Arial.</b></font> =
Exemple Bold Arial.
<font face="arial">Exemple Arial.</font> =
Exemple Arial.
<font face="times new roman"> Exemple Times New Roman.</font> =
Exemple Times New Roman.
- Voici un exemple d'une balise <font>, avec trois attributs différents :
<font
color="#0000ff"
face="comic sans ms"
size="4">Exemple</font> =
Exemple
Police Couleurs
Police
Formats
Surlignage
Avec
WikiNi, entre deux paires de guillemets doubles,
<font size="1">Format #1</font> =
Format #1
<font size="2">Format #2</font> =
Format #2
<font size="3">Format #3</font> =
Format #3
<font size="4">Format #4</font> =
Format #4
<font size="5">Format #5</font> =
Format #5
<font size="6">Format #6</font> =
Format #6
<font size="7">Format #7</font> =
Format #7
Polices Couleurs
Types
Formats
Surlignage
Voici un arc-en-ciel chromatique de codes XHTML pour surligner (et colorer) du texte. De A à O.
Rappel : dans un
WiKi WikiNi, ces codes HTML doivent être entre
deux paires de
"
Surlignage
_A B C_
_D E F G_
_H I J K_
_L M N O_
A
<font style="background-color: #000000" color="#ffffff">~Texte blanc avec fond noir</font>
=
~Texte blanc avec fond black
B
<font style="background-color: #cc99ff" color="#660099">~Texte violet avec fond mauve</font>
=
~Texte violet avec fond mauve
C
<font style="background-color: #660099" color="#ffffff">~Texte blanc avec fond violet</font>
=
~Texte blanc avec fond violet
Surlignage
_A B C_
_D E F G_
_H I J K_
_L M N O_
D
<font style="background-color: #99ffff" color="#0000ff">~Texte bleu avec fond bleu ciel</font>
=
~Texte bleu avec fond bleu ciel
E
<font style="background-color: #0000ff" color="#99ffff">~Texte bleu ciel avec fond bleu</font>
=
~Texte bleu ciel avec fond bleu
F
<font style="background-color: #33cc33" color="#003300">~Texte vert avec fond vert pale</font>
=
~Texte vert avec fond vert pale
G
<font style="background-color: #003300" color="#33cc33">~Texte vert pale avec fond vert</font>
=
~Texte vert pale avec fond vert
Surlignage
_A B C_
_D E F G_
_H I J K_
_L M N O_
H
<font style="background-color: #cccc33" color="#333300">~Texte foncé avec fond jaune</font>
=
~Texte foncé avec fond jaune
I
<font style="background-color: #333300" color="#cccc33">~Texte jaune avec fond foncé</font>
=
~Texte jaune avec fond foncé
J
<font style="background-color: #FF9900" color="#663300">~Texte brûlé avec fond orange</font>
=
~Texte brûlé avec fond orange
K
<font style="background-color: #663300" color="#ff9900">~Texte orange avec fond brûlé</font>
=
~Texte orange avec fond brûlé
Surlignage
_A B C_
_D E F G_
_H I J K_
_L M N O_
L
<font style="background-color: #ff99cc" color="#990000">~Texte rouge avec fond rose</font>
=
~Texte rouge avec fond rose
M
<font style="background-color: #990000" color="#ff99cc">~Texte rose avec fond rouge</font>
=
~Texte rose avec fond rouge
N
<font style="background-color: #cccccc" color="#000000">~Texte noir avec fond gris</font>
=
~Texte noir avec fond gris
O
<font style="background-color: #ffffff" color="#000000">~Texte noir avec fond blanc</font>
=
~Texte noir avec fond blanc
f.
Pour justifier du texte habituellement long
Pas d'équivalent en FoXmatageWikiNi FoXmattinG !
Écrire
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"
<div align="justify">
avant votre texte, qui ici répondra au HTML, et ensuite :
</div>
"
ou encore
"<div align="justify">
"
avant votre texte, qui ici répondra au
FoXmatageWikiNi FoXmattinG, et ensuite :
"</div>
"
Quand on justifie du texte, on l'aligne aux deux marges, celle de gauche et celle de droite.
|
g.
Pour centrer du contenu textuel ou graphique
Pas d'équivalent en FoXmatageWikiNi FoXmattinG!
Avec un texte court, écrire
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"<div align="center">avant votre texte et ensuite :</div>
"
- ou, avec un texte plus long,
"<div align="center">
avant votre texte, qui ici répondra au HTML, et ensuite :
</div>
"
ou
"<div align="center">
"
avant votre texte, qui ici répondra
au
FoXmatageWikiNi FoXmattinG, et ensuite :
"</div>
"
Texte centré.
h.
Pour aligner à droite du contenu textuel ou graphique
Pas d'équivalent en FoXmatageWikiNi FoXmattinG !
Pour du texte
court, comme la date, écrire
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"<div align="right">avant votre texte et ensuite :</div>
"
ou, pour du texte
rarement plus long, écrire
"
<div align="right">
avant votre texte, qui ici répondra au HTML, et ensuite :
</div>
"
ou
"<div align="right">
"
avant votre texte, qui ici répondra
au
FoXmatageWikiNi FoXmattinG, et ensuite :
"</div>
"
Les signatures peuvent être alignées à droite.
i.
Pour mettre en retrait du texte habituellement long
Écrire
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"
<blockquote>
avant votre texte et ensuite :
</blockquote>
"
ou encore
"
<blockquote><div align="justify"><font color="#0000ff">
avant votre texte; ensuite, écrire les balises de fermeture, dans leur ordre inverse d'entrée.
</font></div></blockquote>
"
Ce paragraphe est en retrait :
L'équivalent en FoXmatageWikiNi FoXmattinG est possible en insérant un, deux, ou trois espaces, au début de ligne ou de paragrahe ; on peut aussi insérer des "tabs", mais pas les deux ensemble : un ou l'autre.
j.
Pour changer de ligne ou
retour de ligne forcé
Le code XHTML <br /> crée un changement de ligne, alors qu'un simple changement de ligne, en cliquant "Enter", lors de l'édition, n'en crée pas un dans la p@ge
WiKi publiée, où le
FoXmatageWikiNi est fermé. Conséquemment, dans
WikiNi, pour une meilleure visualisation des p@ges (longues), quand on les modifie, le code <br /> n'a pas à toucher le dernier mot de la première ligne et le premier mot de la deuxième :
(dans WikiNi, avec des paires de guillemets doubles, au lieu d'un seul ")
"ceci est la première ligne<br />et cela, la deuxième"
pourrait donc être remplacé par
|
ou encore, par
|
"
ceci est la première ligne<br />
et cela, la deuxième
"
| "
ceci est la première ligne
<br />
et cela, la deuxième
"
|
pour le même résultat dans la p@ge publiée:
|
ceci est la première ligne et cela, la deuxième
|
Équivalent en FoXmatageWikiNi FoXmattinG :
a) si on écrit ---, ce qui suit sera à la ligne suivante. =
si on écrit
, ce qui suit sera à la ligne suivante.
b)Simplement cliquer "Enter" and changer de ligne.
k.
Pour créer un ligne, ou séparateur horizontal, comme celle dans et sous ce paragraphe "k"
- Dans WikiNi, entre deux paires de guillemets doubles,
si on écrit jusqu'à
<hr />puis, qu'on continue d'écrire juste après,
Si on écrit jusqu'à
puis, qu'on continue d'écrire juste après,
- Pour le même résultat, avec WikiNi,
on termine le paragraphe, on change de ligne et écrit
<hr />
puis, on change de ligne et on continue d'écrire ...
- Cela favorise une meilleure visualisation des (longues) p@ges quand on les modifie.
Équivalent en FoXmatageWikiNi FoXmattinG :
Écrire 4 tirets, "-", crée une ligne.
l.
Pour insérer une im@ge 1/3,
2/3,
3/3.
Explanations, en anglais, on URL @ddresses and Im@ges.
Dans
WikiNi, entre deux paires de guillemets doubles, écrire
<img src="the_URL_@ddress_of_im@ge" alt="obligatoire" title="facultatif" />
Dans le code balise
img, l'attribut
alt est obligatoire.
Pour créer une im@ge centrée qui est un lien, écrire
<div align="center">
<a href="
http://www.wikini.net/wakka.php?wiki=LogoPourWikiNi#djo" title="
WikiNi">
<img src="adresseURLdeLimage" alt="obligatoire" />
</a>
</div>
crée
Im@ge1/3,
2/3,
3/3.
Pour empêcher la bordure de 2 px
qui apparait par défaut autour des images liens,
ajouter border="0px" dans la balise img:
<img src="adresseURLdeLimage" alt="
WikiNi" border="0px" />
crée
Im@ge1/3,
2/3,
3/3.
Si l'im@ge n'est pas un lien, mais
qu'on veut ajouter une bulle d'information qui apparait quand l'im@ge est pointée,
ajouter title="le titre en minuscule" dans la balise img:
<img src="adresseURLdeLimage" alt="bulle minuscule" border="0px" title="bulle minuscule" />
crée
Bien sûr, ces recettes XHTML pour créer des im@ges liens impliquent que l'im@ge soit déjà @ccessible sur le Web. Faire apparaître dans une p@ge Web ou WiKi une im@ge qui est dans un autre esp@ce Web, utilise la bande passante de cet Esp@ce : il semble donc éthiquement souhaitable de demander la permission au(x) propriétaire(s) de l'esp@ce Web, avant d'utiliser une im@ge, à moins que ce ne soit pour un temps limité...
Équivalent en FoXmatageWikiNi FoXmattinG :
écrire l'@dresse entre deux paires de parenthèses [ et ]
- soit sans le http:// comme dans [[www.djo.ca/w01blue.gif]] = www.djo.ca/w01blue.gif
- ou soit, avec le http:// et aussi un texte dit alternatif : comme dans [[http://www.djo.ca/w01red.gif WikiNi]] =
m.
Pour créer un lien direct
à une autre p@ge Web ou WiKi, dans
WikiNi, entre deux paires de guillemets doubles, écrire
<a href="adresse_URL_dela_p@ge">Texte lien ou Im@ge lien</a>
ou
<a href="adresse_URL_dela_p@ge" title="bulle d'information">Texte lien ou Im@ge lien</a>
ou, par exemple :
<a href="
http://www.wikipedia.org" title="Le plus grand
WiKi du Monde">Wikipedia</a> =
Wikipedia
à une @dresse courriel, entre deux paires de guillemets doubles, écrire
<a href="mailto:adresse.fictive@sympatico.ca">Texte lien ou Im@ge lien</a>
ou
<a href="mailto:adresse.fictive@sympatico.ca?subject=FoXparleXhtml" title="envoyer un em@il">Lien courriel</a> =
Équivalent en FoXmatageWikiNi FoXmattinG :
a) NomWiKi ou MotWiki
b)Lien automatique externe : http://www.wikipedia.org
c) Liens forcés externes : [[http://www.wikipedia.org]] = http://www.wikipedia.org
[[http://www.wikipedia.org Le WiKi de Wikipedia]] = Le WiKi de Wikipedia
d) Liens forcés courriel : [[toto@example.org]] = toto@example.org
[[toto@example.org Adresse de toto]] = Adresse de toto
n.
Pour créer un lien target="_blank" à une autre p@ge WiKi ou Web
Pas d'équivalent en FoXmatageWikiNi FoXmattinG !
Un lien target="_blank" ouvre dans une nouvelle fenêtre ou dans un nouveau "tab".
- Avec WikiNi, entre deux paires de guillemets doubles, écrire,
<a href="adresse_URL_dela_p@ge" target="_blank">Texte lien ou Im@ge lien</a>
<div align="center">
<a target="_blank" href="
http://www.wikipedia.org" title="Le plus grand
WiKi du Monde">Wikipedia</a>
</div>
crée :
Wikipedia
Il est
convivial d'indiquer quand un lien est un
lien target="_blank".
o.
Pour créer un lien interne dans la p@ge même
Pas d'équivalent en FoXmatageWikiNi FoXmattinG !
Avec
WikiNi, entre deux paires de guillemets doubles,
a) créer une cible :
<a name="nom_dela_cible">La cible peut être
rien, du texte, ou une im@ge</a>
b) créer un lien vers la cible :
<a href="#nom_dela_cible">Le lien peut être du texte ou une im@ge.</a>
Chaque barre de liens, au dessus de chacun des codes XHTML de cette p@ge,
- est faite de 20 liens internes et d'une cible.
p.
Pour créer une liste à puces
Avec
WikiNi, entre deux paires de guillemets doubles, écrire
<ul>
<li>Item #1</li>
<li>Item #2</li>
<li>Item #3</li>
<li>Item #4</li>
<li>Item #5</li>
</ul>
crée :
- Item #1
- Item #2
- Item #3
- Item #4
- Item #5
Équivalent en FoXmatageWikiNi FoXmattinG : voir FoXmatageWikiNi #Listes-Retrait.
Pour ce qui est des listes à puces, le FoXmatageWikiNi est plus simple que le HTML.
q.
Pour créer une liste numérotée Avec WikiNi, entre deux paires de guillemets doubles, écrire
<ol>
<li>Item # 1</li>
<li>Item # 2</li>
<li>Item # 3</li>
</ol>
|
crée
|
- Item # 1
- Item # 2
- Item # 3
|
<ol style="list-style-type: lower-alpha;">
<li>Item # a</li>
<li>Item # b</li>
<li>Item # c</li>
</ol>
|
crée
|
- Item # a
- Item # b
- Item # c
|
<ol style="list-style-type: upper-alpha;">
<li>Item # A</li>
<li>Item # B</li>
<li>Item # C</li>
</ol>
|
crée
|
- Item # A
- Item # B
- Item # C
|
<ol style="list-style-type: lower-roman;">
<li>Item # i</li>
<li>Item # ii</li>
<li>Item # iii</li>
</ol>
|
crée
|
- Item # i
- Item # ii
- Item # iii
|
<ol style="list-style-type: upper-roman;">
<li>Item # I</li>
<li>Item # II</li>
<li>Item # III</li>
</ol>
|
crée
|
- Item # I
- Item # II
- Item # III
|
Équivalent en FoXmatageWikiNi FoXmattinG : voir FoXmatageWikiNi #Listes-Retrait
r. Tableau
r1
r2
r3
r4
r5
r6
r7
To Create Fancy TABLES est en construction.
Pas d'équivalent en FoXmatageWikiNi FoXmattinG, excepté ici.
Les tableaux sont l'encodage XHTML le plus complexe dans cette p@ge ;
il y a trois balises principales :
<table>,
<tr> pour les lignes, et
<td> pour chaque cellule.
Voici un code XHTML, où insérer du contenu dans un tableau bleu pale ;
- la balise <table> y a 4 attributs :
- avec WikiNi, entre deux paires de guillemets doubles, écrire
<table
align="center"
bgcolor="#99ffff"
border="2px"
width="555px">
<tr><td>
votre contenu, qui ici répondra au HTML.
</td></tr></table>
votre contenu, qui ici répondra au HTML.
|
r. Tableau
r1
r2
r3
r4
r5
r6
r7
Le code précédent fonctionne parfaitement,
- s'il n'est pas dans une p@ge WiKi plus large que l'écran.
Voici un code encore plus simple et
gr@phiquement sécure : le tableau,
par défaut,
- sera aligné à gauche, vu qu'il n'y a pas d'attribut align,
- aura une bordure de 0px, vu qu'il n'y a pas d'attribut border.
- Avec WikiNi, entre deux paires de guillemets doubles, écrire
<table bgcolor="#99ffff" width="555px">
<tr><td>
votre contenu, qui ici répondra au HTML.
</td></tr></table>
votre contenu, qui ici répondra au HTML.
|
r. Tableau
r1
r2
r3
r4
r5
r6
r7
Si le WiKi a un menu vertical, ajuster la largeur du tableau, pour ne pas élargir la p@ge.
Les fonds et largeurs de chaque cellule peuvent être définis dans la balise <td>;
on peut aligner, ici à droite, les contenus des cellules d'une rangée dans la balise <tr>.
- avec WikiNi, entre deux paires de guillemets doubles, si on écrit
<table align="center" border="0px" bgcolor="#000000" width="540px">
<tr align="right">
<td bgcolor="#cccc33" width="190px">Première colonne /fond jaune</td>
<td bgcolor="#ff9900" width="160px">Deuxième colonne /fond orange</td>
<td bgcolor="#ff9999" width="190px">Troisième colonne /fond rose</td>
</tr>
</table>
Première colonne /fond jaune |
Deuxième colonne /fond orange |
Troisième colonne /fond rose |
r. Tableau
r1
r2
r3
r4
r5
r6
r7
La balise <table> du code XHTML pour les tableaux peut aussi inclure les deux attributs
C :
Avec le HTML 4.0, la balise <table>, a ± neuf attributs, alors qu'avec le XHTML 1.0, on peut se débrouiller avec six :
les attributs "background", "cols" et "height" ne sont pas du XHTML 1, mais plutôt du HTML 4.
1. TABLEAUX ~
Aide-mémoire pour la balise <table> : (a, bb, cc, w)
- 1. align="center", or align="right" alignent dans la p@ge le tableau, aligné à gauche, par défaut.
- background="@dresseURLdeLim@ge" n'est pas du XHTML valide.
- 2. bgcolor="#ff00CC" définit la couleur de fond du tableau, transparent par défaut.
- 3. border="0px" définit en px la bordure du tableau ; par défaut, 1px.
- 4. cellpadding="0px" définit en px la distance entre le contenu et la cellule ; par défaut, 1px.
- 5. cellspacing="0px" définit en px la distance entre les cellules ; par défaut, 1px.
- cols="3" n'est pas du XHTML valide.
- height="222px" n'est pas du XHTML valide.
- 6. width="699px" définit en px la largeur du tableau : avec un écran de 17", dans une p@ge WiKi pleine largeur, 699 px, c'est serré ; 688 px est plus passe partout, surtout avec Internet Explorer 6 ; 666 px, c'est encore mieux. On peut également définir la largeur en pourcentage : <table width="100%">.
Suggestion : écrire systématiquement les attributs de la balise <table> en ordre alphabétique.
r. Tableau
r1
r2
r3
r4
r5
r6
r7
- En XHTML, les balises <tr> et <td> ont respectivement deux et trois attributs :
2. <tr> (la ligne ou rangée)
- a. align="center", ou align="right" alignent le contenu de toutes les cellules de la ligne.
- background="@dresseURLdeLim@ge" n'est pas du XHTML 1.0 transitionnel valide.
- b. bgcolor="#ff00CC" définit la couleur de fond de la ligne.
3. <td> (la cellule)
- a. align="center", ou align="right" alignent le contenu de la cellule.
- background="@dresseURLdeLim@ge" n'est pas du XHTML 1.0 transitionnel valide.
- b. bgcolor="#ff00CC" définit la couleur de fond de la cellule.
- w. width="299px" définit la largeur de la cellule.
r. Tableau
r1
r2
r3
r4
r5
r6
r7 DjO ai créé ce gr@phe pour le HTML 4.0 transitionnel avec MOT 2.3 et Paint.
r. Tableau
r1
r2
r3
r4
r5
r6
r7
Avec MOT 2.3 et Paint,
DjO ai créé cet autre gr@phe, spécifiquement pour le XHTML 1.0,
vu que les attributs "background", "cols" et "height" ne sont pas du XHTML transitionnel valide.
Somme toute, le résultat est beaucoup plus aéré et
digestible.
--
DjO 13jan2005.
s.
Pour créer des TITRES + Affiche de BIENVENUE (et bogue)
Pour les TITRES, avec
WikiNi, entre deux paires de guillemets doubles, si on écrit
<h1>Titre #1</h1>
<h2>Titre #2</h2>
<h3>Titre #3</h3>
on crée :
Titre #1
Titre #2
Titre #3
Équivalent en FoXmatageWikiNi FoXmattinG :
======Titre #1====== (6 "-")
=====Titre #2===== (5 "-")
====Titre #3==== (4 "-")
Titre #1
Titre #2
Titre #3
s2.
AFFICHE de BIENVENUE dans un tableau, avec une bordure de 3 px, un fond violet, et une police mauve.
Prenez note qu'avec
WikiNi, dans les tableaux construits par XHTML, il y a un
bogue :
les codes <h1> et <font size> ne sont pas interprétés par les Netscape Navigators 4x :
ainsi, dans un tableau, on voit le texte avec le format par défaut de la police,
même quand les codes <h1> à <h7> et /ou <font size="1"> à <font size="7"> sont utilisés.
Cependant, les balises <font face> et <font color> sont lues correctement par NN4x.
Avec
WikiNi, entre deux paires de guillemets doubles, si on écrit
<table align="center" border="3px" bgcolor="#993399" width="199px">
<tr>
<td>
<div align="center">
<h1><font color="#ffccff" face="comic sans ms">BIENVENUE</font></h1>
</div>
</td>
</tr>
</table>
on crée :
Contenu de cette p@ge WiKi en ordre alphabétique
- Affiche
- Alignements à droite, centré, et justifié.
- Changer de ligne.
- Effacer.
- Gras.
- Im@ges.
- Italique.
- Lignes séparatrices horizontales.
- Liens directs.
- Liens internes.
- Liens target="_blank".
- Listes /Puces.
- Listes /Numéros.
- Polices : couleurs, formats, surlignage, types.
- Retrait.
- Tableaux.
- Titres.
- Souligner.
Spécificités sur cette p@ge WiKi et les codes XHTML qui y sont présentés
- * Le contenu de cette p@ge WiKi est du HTML 4.0 transitionnel et du XHTML 1.0 transitionnel valides.
- * Les codes présentés dans cette p@ge WiKi sont du XHTML 1.0 transitionnel.
- * Tous les attributs de balises sont définis dans une paire de guillemets doubles :
- par exemple, <div align="center">
- * Mieux vaut court que long ; the shorter, the better : par exemple, <b> versus <strong>.
- * Tous les codes, (excepté le s2, avec NN4x), sont interprétés par Internet Explorer 6,
- et aussi Netscape Navigators 4x et 7x.
- * Tous les codes sont en minuscules.
- * Ne mettre qu'une seule balise HTML par ligne, fonctionne dans un WiKi WikiNi,
- car un changement de ligne à l'édition n'en crée pas un dans la p@ge WiKi publiée.
- * Les codes HTML suivants, issus de cette liste, ne sont pas inclus plus haut dans cette p@ge :
- o <em> mis en valeur</em>
- o <strong> fortement mis en valeur </strong>
- o <tt> télétype</tt>
- o <pre> préformaté </pre>
- o <ins> inséré </ins>
- o <del> effacé </del>
- o <sup> exposant </sup>
- o <sub> indice </sub>
- o <cite> citation </cite>
- o <q> citation en ligne </q>
- o <code> entrée de code </code>
- o <samp> sortie de code </samp>
- o <kbd> saisie clavier </kbd>
- o <var> variable </var>
- o <dfn> définition </dfn>
- o <abbr> abbréviation </abbr>
- o <acronym> acronyme </acronym>
- o <p> paragraphe </p>
- Avertissement :
Netscape Navigator 7x et Internet Explorer 6 acceptent d'interpréter certaines erreurs HTML ; cependant, si on @ccède une p@ge WiKi avec Netscape Communicators 4x, incluant la dernière version 4.8 de 2002, que vous pouvez télécharger gratuitement,
- vous pourriez voir une p@ge blanche sans contenu visible.
- Cela peut être à cause d'une seule balise HTML oubliée ou en trop. Pourquoi ?
- Conséquemment, on peut suggérer que c'est notre responsabilité de méthodiquement vérifier les modific@tions HTML à une p@ge WiKi, avec Netscape Navigator 4.8, avant de fermer boutique.
- Finalement, pour les perfectionnistes, il est esssentiel de vérifier l'intégrité du XHTML 1.0 transitionnel de la p@ge modifiée avec le validateur XHTML du W3C ; pour les perfectionnistes méthodiques, il apparait logique de vérifier le XHTML avant et après.
- Cette p@ge WiKi présente deux gr@phes et huit im@ges, hébergées par djo.ca, et designées par
- Joseph Deneault, Djeault, DjO, qui est le j@rdinier, @rtisan, cré@teur
- de la p@ge BambaFox,
- de la p@ge FoXmatageWikiNi,
- de sa version anglaise FoXmattinG,
- de cette p@ge-ci, FoXparleXhtml,
- de sa version anglaise FoXspeaqsXhtml,
- de la p@ge BambaFoxInstaller,
- de sa version anglaise BambaFoxInstall.
- Des deux dernières p@ges, on peut @ccéder le code source des sept p@ges de BambaFox.
- Cliquer BambaFox.gif, en haut à gauche des sept p@ges de BambaFox, vous @mènera au code source de cette p@ge.
- Ces sept p@ges WiKi forment un système bilingue, anglais et français, interconnecté visant à communiquer l'information pratique et utile sur le formatage dans un WiKi WikiNi, soit par "FoXmatageWikiNi", soit par Encodage XHTML.
- Ces sept p@ges ne peuvent ni être modifiées, ni commentées : pour les critiquer ou les commenter, ou encore pour suggérer des améliorations, demander des explications, et /ou signaler des erreurs, DjO vous invite à le faire dans les p@ges :
- WikiNi:DiscussionsBambaFox (interwiki)
- WikiNi:DiscussionsFoXparleXhtml (interwiki)
- WikiNi:DiscussionsFoXspeaqsXhtml (interwiki)
- WikiNi:DiscussionsFoXmatageWikiNi (interwiki)
- WikiNi:DiscussionsFoXmattinG (interwiki)
- WikiNi:DiscussionsBambaFoxInstaller (interwiki)
- WikiNi:DiscussionsBambaFoxInstall (interwiki)
- Excluant cette section finale, cette p@ge WiKi offre 37 écrans, tout comme sa version anglaise.
- En tout, excluant les sections finales d'Info,
- l'@ide-mémoire BambaFox présente 13 im@ges et plus de 111 écrans.
- BambaFox version01d découle de cette discussion (interwiki).
--
DjO 11fev2005