« DocModif » : différence entre les versions
Aucun résumé des modifications |
Aucun résumé des modifications |
||
(145 versions intermédiaires par 3 utilisateurs non affichées) | |||
Ligne 1 : | Ligne 1 : | ||
<div class="docModif"> | <div class="docModif"> | ||
== Liens utiles == | == Liens utiles == | ||
<li>[[test_julien]]</li> | |||
Lien vers l'ensemble de pages admin (= upload d'images, création d'identifiants, changement de droits utilisateurs, etc.) : | |||
[[Spécial:Pages spéciales]] | |||
Pour uploader des images : | Pour uploader des images : | ||
[[Spécial:Téléverser]] | [[Spécial:Téléverser]] | ||
Lien direct vers la css : | |||
[[MediaWiki:Global.css]] | |||
Lien direct vers le js : | |||
[[MediaWiki:Global.js]] | |||
== Menus latéraux == | |||
Les menus latéraux sont à présent stockés dans un article à part puis inclus dans les articles qui en ont besoin, afin qu'en cas de changement celui-ci soit répercuté directement sur toutes les pages concernées plutôt que de devoir le changer sur toutes les pages une par une. | |||
<pre>{{:nom_de_l'article}}</pre> | |||
Noms et lien des articles contenant les menus | |||
===Menus du wiki fr=== | |||
<ul> | |||
<li>[[Menu_Installer]]</li> | |||
<li>[[Menu_Configurer]]</li> | |||
<li>[[Menu_Concevoir]]</li> | |||
<li>[[Menu_Décorer]]</li> | |||
<li>[[Menu_Visualiser]]</li> | |||
<li>[[Menu_Vendre]]</li> | |||
<li>[[Menu_Gabarits]]</li> | |||
<li>[[Menu_Avancé]]</li> | |||
</ul> | |||
===Menus du wiki en=== | |||
<ul> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Installer En_Installer]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Configurer En_Configurer]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Concevoir En_Concevoir]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_D%C3%A9corer En_Décorer]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Visualiser En_Visualiser]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Vendre En_Vendre]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=En_Gabarits En_Gabarits]</li> | |||
<li>[https://en.wiki.insitu.education/index.php?title=Other_Functions En_Avancé]</li> | |||
</ul> | |||
===Menus du wiki es=== | |||
<ul> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Installer Es_Installer]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Configurer Es_Configurer]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Concevoir Es_Concevoir]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Décorer Es_Décorer]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Visualiser Es_Visualiser]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Vendre Es_Vendre]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Gabarit Es_Gabarits]</li> | |||
<li>[https://es.wiki.insitu.education/index.php?title=Es_Avancé Es_Avancé]</li> | |||
</ul> | |||
===Menus du wiki nl=== | |||
<ul> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Installer Nl_Installer]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Configurer Nl_Configurer]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Concevoir Nl_Concevoir]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Décorer Nl_Décorer]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Gabarit Nl_Gabarits]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Visualiser Nl_Visualiser]</li> | |||
<li>[https://nl.wiki.insitu.education/index.php?title=Nl_Vendre Nl_Vendre]</li> | |||
===Menus du wiki de=== | |||
https://de.wiki.insitu.education/index.php?title=Hauptseite | |||
<ul> | |||
</ul> | |||
== Syntaxe == | |||
=== Liens === | |||
==== Liens internes ==== | |||
===== Navigation ===== | |||
Les liens de navigation permettent de circuler d'une page à l'autre DANS LE WIKI. | |||
<pre>[[nom_de_l'article|Texte que l'utilisateur voit]]</pre> | |||
Exemple : | |||
[[Installer_le_logiciel_InSitu|Page très utile]] | |||
Il est également possible de donner le lien d'un endroit spécifique dans une page. Pour ce faire, préparez d'abord la section de la page sur laquelle vous voulez arriver, soit en l'indiquant comme titre, soit en lui adjoignant un id : | |||
<pre>===Titre===</pre> | |||
<pre><span id="mon_id">Ancre</span></pre> | |||
Le lien se fait ensuite de la même façon que n'importe quel autre lien, entre [[]]. | |||
Si le lien est dans la page même : | |||
<pre>[[#Titre|Texte que l'utilisateur voit]]</pre> | |||
<pre>[[#mon_id|Texte que l'utilisateur voit]]</pre> | |||
Exemple : | |||
[[#Ajouter de l'espace autour d'un élément|Ajouter de l'espace autour d'un élément]] | |||
Si le lien est vers une section spécifique d'une autre page : | |||
<pre>[[nom_de_l'article#nom_du_titre_ou_id|Texte que l'utilisateur voit]]</pre> | |||
Exemple : | |||
[[Installer_le_logiciel_InSitu#Exemple_en_cours|Page très utile]] | |||
===== Inclusion ===== | |||
====== D'un article ====== | |||
L'article se trouvera affiché directement dans la page, comme si son contenu avait été écrit directement dans la page. Utile notamment pour les menus de navigation. | |||
<pre>{{:nom_de_l'article}}</pre> | |||
Exemple: | |||
{{:Menu_Installer}} | |||
====== D'une image ====== | |||
Pour inclure une image dans un article, il faut d'abord commencer par l'[[Spécial:Téléverser|uploader]]. | |||
Une image uploadée est inclue grâce à la syntaxe suivante | |||
<pre>[[File:nom_de_l_image]]</pre> | |||
ATTENTION : pour utiliser une image provenant du wiki fr dans un wiki d'une autre langue, la syntaxe n'est pas la même | |||
<pre>[[Image:nom_de_l_image]]</pre> | |||
Pour éviter qu'une image soit cliquable par défaut et amène vers une autre page du wiki, ajoutez un "|link=" sans lien | |||
<pre>[[File:nom_de_l_image|link=]] | |||
[[Image:nom_de_l_image|link=]]</pre> | |||
Exemple : | |||
Sans "|link=" : | |||
[[File:Exemple_img.jpg]] | |||
Avec "|link=" : | |||
[[File:Exemple_img.jpg|link=]] | |||
(cliquez sur chacune des images pour voir la différence) | |||
==== Liens externes ==== | |||
Pour linker la page d'un site qui n'est pas le wiki fr, la syntaxe est la suivante | |||
<pre>[https//www.adresse_du_site.fr texte visible du lien(optionnel)]</pre> | |||
Exemple : | |||
[https://fr.wikipedia.org/wiki/Tintin Lien très très cool] | |||
=== Commentaire === | |||
Le commentaire permet de retirer de la vue du contenu sur la page, mais de le garder visible lors de l'édition de celle-ci. Peut contenir du texte comme du balisage html. | |||
<pre><!--Ceci est un commentaire--></pre> | |||
Exemple : | |||
<!--Passe une bonne journée !--> | |||
== Classes de mise en page == | == Classes de mise en page == | ||
Cette classe sert à mettre un chiffre dans un cercle. | |||
=== Classes générales (couleur, gras, etc.) === | |||
==== big ==== | |||
Cette classe permet de mettre un texte en plus grand. | |||
<pre><p class="big">Je suis grand</p></pre> | |||
Exemple : | |||
<p class="big">Je suis grand</p> | |||
==== bold ==== | |||
Cette classe permet de mettre un texte en gras. | |||
<pre><p class="bold">Je suis gras</p></pre> | |||
Exemple : | |||
<p class="bold">Je suis gras</p> | |||
Mettre un bold dans une balise portant une classe bold le mettra en très gras. | |||
<pre><p class="bold"><span>Je suis gras</span> <span class="bold">Je suis très gras</span></p></pre> | |||
Exemple : | |||
<p class="bold"><span>Je suis gras</span> <span class="bold">Je suis très gras</span></p> | |||
==== sup ==== | |||
Cette balise permet de mettre un texte en exposant. | |||
<pre><p>Texte ordinaire<sup>Texte en exposant</sup></p></pre> | |||
Exemple : | |||
<p>Texte ordinaire<sup>Texte en exposant</sup></p> | |||
==== txt-is ==== | |||
Cette classe sert à mettre un texte en orange, "couleur InSitu". | |||
<pre><p class="txt-is">InSitu</p></pre> | |||
Exemple : | |||
<p class="txt-is">InSitu</p> | |||
==== txt-gris ==== | |||
Cette classe sert à mettre un texte en gris. | |||
<pre><p class="txt-gris">Texte gris</p></pre> | |||
Exemple : | |||
<p class="txt-gris">Texte gris</p> | |||
=== Présentation particulière d'un élément === | |||
==== title_page ==== | |||
Cette classe ne fonctionne uniquement lorsqu'elle est mise sur une balise h1. Elle sert à mettre en avant le titre d'une page. | |||
<pre><h1 class="title_page">Ceci est un titre de page</h1></pre> | |||
===== bg-blue ===== | |||
Associée à title_page, cette classe change la présentation par défaut du titre pour le mettre en blanc sur fond bleu. | |||
<pre><h1 class="title_page bg-blue">Ceci est un titre de page bleu</h1></pre> | |||
===== bg-green ===== | |||
Associée à title_page, cette classe change la présentation par défaut du titre pour le mettre en blanc sur fond vert. | |||
<pre><h1 class="title_page bg-green">Ceci est un titre de page vert</h1></pre> | |||
==== chiffre ==== | |||
Cette classe sert à mettre un élément dans un cercle. Utilisé pour les chiffres et les i des points d'information. | |||
<pre><span class="chiffre">0</span></pre> | <pre><span class="chiffre">0</span></pre> | ||
Ligne 17 : | Ligne 237 : | ||
<span class="chiffre">0</span> | <span class="chiffre">0</span> | ||
=== encadre === | ==== encadre ==== | ||
Cette classe sert à mettre en évidence un ou plusieurs paragraphes de textes avec un cadre et un background particulier. | Cette classe sert à mettre en évidence un ou plusieurs paragraphes de textes avec un cadre et un background particulier. | ||
Ligne 31 : | Ligne 251 : | ||
Exemple : | Exemple : | ||
<p class="encadre">You call this cat food please stop looking at your phone and pet me human give me attention meow. Munch, munch, chomp, chomp cat gets stuck in tree firefighters try to get cat down firefighters get stuck in tree cat eats firefighters' slippers yet reaches under door into adjacent room flee in terror at cucumber discovered on floor knock dish off table head butt cant eat out of my own dish.</p> | <p class="encadre mb-20">You call this cat food please stop looking at your phone and pet me human give me attention meow. Munch, munch, chomp, chomp cat gets stuck in tree firefighters try to get cat down firefighters get stuck in tree cat eats firefighters' slippers yet reaches under door into adjacent room flee in terror at cucumber discovered on floor knock dish off table head butt cant eat out of my own dish.</p> | ||
<div class="encadre"> | <div class="encadre"> | ||
The cat was chasing the mouse demand to have some of whatever the human is cooking, then sniff the offering and walk away love blinks and purr purr purr purr yawn. Meowing non stop for food shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Lick the plastic bag cat cat moo moo lick ears lick paws purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow . Steal mom's crouton while she is in the bathroom kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. | The cat was chasing the mouse demand to have some of whatever the human is cooking, then sniff the offering and walk away love blinks and purr purr purr purr yawn. Meowing non stop for food shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Lick the plastic bag cat cat moo moo lick ears lick paws purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow . Steal mom's crouton while she is in the bathroom kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. | ||
Ligne 38 : | Ligne 258 : | ||
</div> | </div> | ||
=== flex === | |||
<pre><p style="border:solid 1px #ea560d;border-radius:5px;background-color:#f6f6f6;padding:10px">contenu</p></pre> | |||
<p style="border:solid 1px #ea560d;border-radius:5px;background-color:#f6f6f6;padding:10px"> blabla blabla blabla.</p> | |||
==== info ==== | |||
Cette classe sert à changer la police et italiciser un élément. Utilisé en complément de la classe chiffre pour créer un point d'information. | |||
<pre><span class="info">i</span></pre> | |||
<pre><span class="chiffre info">i</span></pre> | |||
Exemple : | |||
<p>Info seul : | |||
<span class="info">i</span></p> | |||
<p>Info avec la classe "chiffre" : | |||
<span class="chiffre info">i</span></p> | |||
==== important ==== | |||
Cette classe sert à mettre en évidence une information. | |||
<pre><p class="important">Ceci est absolument crucial !</p></pre> | |||
Exemple : | |||
<p class="important">Ceci est absolument crucial !</p> | |||
==== shadow ==== | |||
Cette classe ajoute une ombre autour d'un élément, lui donnant un effet de relief. | |||
<pre><div class="shadow">[[Image]], texte, etc.</div></pre> | |||
Exemple : | |||
<div class="shadow" style="display:inline-block">[[Fichier:Exemple_img.jpg]]</div> | |||
=== Placer les éléments sur la page === | |||
==== flex ==== | |||
Cette classe permet d'aligner des éléments, textuels ou images. Elle est à mettre sur une balise englobant tous les éléments à aligner. | Cette classe permet d'aligner des éléments, textuels ou images. Elle est à mettre sur une balise englobant tous les éléments à aligner. | ||
ATTENTION : si la largeur de l'ensemble des éléments (notamment des images) est supérieure à la largeur de l'écran, | ATTENTION : si la largeur de l'ensemble des éléments (notamment des images) est supérieure à la largeur de l'écran, vous créerez un scroll horizontal. A ÉVITER ! | ||
ATTENTION : les largeurs spécifiques de vos éléments ne sont pas forcément prises en compte par un flex simple. Pour que vos largeurs soient respectées dans un flex, référez-vous au wrap. | |||
ATTENTION : pour éviter la déformation des images, mettez toujours votre lien d'image dans une balise div. | ATTENTION : pour éviter la déformation des images, mettez toujours votre lien d'image dans une balise div. | ||
<pre><div class="flex"> | <pre><div class="flex"> | ||
<div>[[lien d'une image]]</div> | <div>[[lien d'une image]]</div> | ||
Ligne 56 : | Ligne 315 : | ||
</div> | </div> | ||
=== Classes relatives au flex === | |||
==== Classes relatives au flex ==== | |||
ATTENTION : les pages suivantes doivent OBLIGATOIREMENT se placer après une classe flex sur la balise pour fonctionner. | ATTENTION : les pages suivantes doivent OBLIGATOIREMENT se placer après une classe flex sur la balise pour fonctionner. | ||
==== col ==== | ===== col ===== | ||
Cette classe permet de changer le sens d'alignement des éléments dans un flex : au lieu d'être horizontal, l'alignement est vertical. Utile pour placer précisément plusieurs éléments les uns à la suite des autres. | Cette classe permet de changer le sens d'alignement des éléments dans un flex : au lieu d'être horizontal, l'alignement est vertical. Utile pour placer précisément plusieurs éléments les uns à la suite des autres. | ||
Ligne 77 : | Ligne 337 : | ||
</div> | </div> | ||
==== x_center ==== | ==== wrap ==== | ||
Cette classe permet à flex de conserver la taille des éléments qu'il contient, quitte à les renvoyer à la ligne. | |||
<pre><div class="flex wrap"> | |||
<div>[[lien d'une image]]</div> | |||
<p>Texte</p> | |||
div>[[lien d'une image]]</div> | |||
</div></pre> | |||
Exemple : | |||
<div class="flex wrap"> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
<div>[[Fichier:Exemple_img.jpg]]</div> | |||
</div> | |||
===== x_center ===== | |||
Cette classe permet de centrer horizontalement des éléments d'un flex. | Cette classe permet de centrer horizontalement des éléments d'un flex. | ||
Ligne 94 : | Ligne 382 : | ||
</div> | </div> | ||
==== x_evenly ==== | ===== x_evenly ===== | ||
Cette classe permet de répartir de façon égale l'espace autour des éléments d'un flex sur l'axe horizontal. | Cette classe permet de répartir de façon égale l'espace autour des éléments d'un flex sur l'axe horizontal. | ||
Ligne 111 : | Ligne 399 : | ||
</div> | </div> | ||
==== y_center ==== | ===== y_center ===== | ||
Cette classe permet de centrer les éléments d'un flex sur l'axe vertical. | Cette classe permet de centrer les éléments d'un flex sur l'axe vertical. | ||
Ligne 127 : | Ligne 415 : | ||
</div> | </div> | ||
=== m-20 === | |||
==== txt-center ==== | |||
Cette classe permet de centrer des éléments. | |||
<pre><div class="txt-center">Contenu divers</div></pre> | |||
<pre><p class="txt-center">Contenu textuel</p></pre> | |||
Exemple : | |||
<div class="txt-center">[[Fichier:Exemple_img.jpg]]</div> | |||
==== txt-right ==== | |||
Cette classe permet d'aligner les éléments sur la droite. | |||
<pre><div class="txt-right">Contenu divers</div></pre> | |||
<pre><p class="txt-right">Contenu textuel</p></pre> | |||
Exemple : | |||
<div class="txt-right">[[Fichier:Exemple_img.jpg]]</div> | |||
=== Ajouter de l'espace autour d'un élément === | |||
==== m-20 ==== | |||
Cette classe ajoute un peu d'espace autour d'un élément (20 px). | Cette classe ajoute un peu d'espace autour d'un élément (20 px). | ||
Ligne 143 : | Ligne 456 : | ||
<p>Terrorize the hundred-and-twenty-pound rottweiler and steal his bed, not sorry refuse to leave cardboard box but under the bed, and refuse to leave cardboard box pet me pet me don't pet me meow to be let out. Chew iPad power cord run at 3am and get scared by doggo also cucumerro give me some of your food give me some of your food give me some of your food meh, i don't want it for stare at imaginary bug humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean for hopped up on catnip.</p> | <p>Terrorize the hundred-and-twenty-pound rottweiler and steal his bed, not sorry refuse to leave cardboard box but under the bed, and refuse to leave cardboard box pet me pet me don't pet me meow to be let out. Chew iPad power cord run at 3am and get scared by doggo also cucumerro give me some of your food give me some of your food give me some of your food meh, i don't want it for stare at imaginary bug humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean for hopped up on catnip.</p> | ||
=== mt-20 === | |||
==== mb-20 ==== | |||
Cette classe ajoute un peu d'espace sous un élément (20px). | |||
<pre><div class="mb-20"></div></pre> | |||
<pre><p class="mb-20"></p></pre> | |||
Exemple : | |||
<div class="mb-20">[[Fichier:Exemple_img.jpg]]</div> | |||
<p>I meant to do that now i shall wash myself intently for groom yourself 4 hours - checked, have your beauty sleep 18 hours - checked, be fabulous for the rest of the day - checked. Stretch out on bed hunt by meowing loudly at 5am next to human slave food dispenser and try to jump onto window and fall while scratching at wall for if human is on laptop sit on the keyboard yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce, cough hairball on conveniently placed pants but hell is other people. I’m so hungry i’m so hungry but ew not for that catch mouse and gave it as a present for spend six hours per day washing, but still have a crusty butthole scratch leg; meow for can opener to feed me for car rides are evil.</p> | |||
==== ml-20 ==== | |||
Cette classe ajoute un peu d'espace à gauche d'un élément (20px). | |||
<pre><div class="ml-20"></div></pre> | |||
<pre><p class="ml-20"></p></pre> | |||
Exemple : | |||
<div class="flex"> | |||
<p>Plays league of legends fat baby cat best buddy little guy so whatever, catch mouse and gave it as a present but scratch the furniture. Sitting in a box i heard this rumor where the humans are our owners, pfft, what do they know?! or get away from me stupid dog, lick arm hair but i’m so hungry i’m so hungry but ew not for that . Sees bird in air, breaks into cage and attacks creature kitty loves pigs and sit as close as possible to warm fire without sitting on cold floor. Pet me pet me don't pet me. Try to jump onto window and fall while scratching at wall purr like an angel, get away from me stupid dog get away from me stupid dog, for so you're just gonna scroll by without saying meowdy? eat fish on floor.</p> | |||
<div class="ml-20">[[Fichier:Exemple_img.jpg]]</div> | |||
</div> | |||
==== mr-20 ==== | |||
Cette classe ajoute un peu d'espace à droite d'un élément (20px). | |||
<pre><div class="mr-20"></div></pre> | |||
<pre><p class="mr-20"></p></pre> | |||
Exemple : | |||
<div class="flex"> | |||
<div class="mr-20">[[Fichier:Exemple_img.jpg]]</div> | |||
<p>Scamper sleep on keyboard. Really likes hummus you call this cat food for purr like an angel found somthing move i bite it tail for plan steps for world domination so hate dogs cat milk copy park pee walk owner escape bored tired cage droppings sick vet vomit. Paw at your fat belly have my breakfast spaghetti yarn brown cats with pink ears pounce on unsuspecting person mess up all the toilet paper cat is love, cat is life. Check cat door for ambush 10 times before coming in. Bite the neighbor's bratty kid hunt anything that moves attempt to leap between furniture but woefully miscalibrate and bellyflop onto the floor; what's your problem? i meant to do that now i shall wash myself intently ha ha, you're funny i'll kill you last.</p> | |||
</div> | |||
==== mt-20 ==== | |||
Cette classe ajoute un peu d'espace au-dessus d'un élément (20px). | Cette classe ajoute un peu d'espace au-dessus d'un élément (20px). | ||
<pre><div class=" | <pre><div class="mt-20"></div></pre> | ||
<pre><p class="m- | <pre><p class="mt-20"></p></pre> | ||
Exemple : | |||
<p>Brown cats with pink ears crash against wall but walk away like nothing happened. Meow meow you are my owner so here is a dead rat spread kitty litter all over house, cattt catt cattty cat being a cat steal raw zucchini off kitchen counter. Swat turds around the house. Woops poop hanging from butt must get rid run run around house drag poop on floor maybe it comes off woops left brown marks on floor human slave clean lick butt now attempt to leap between furniture but woefully miscalibrate and bellyflop onto the floor; what's your problem?</p> | |||
<div class="mt-20">[[Fichier:Exemple_img.jpg]]</div> | |||
=== Changer la taille d'un élément === | |||
==== w-full ==== | |||
Fixe la largeur d'un élément à 100%. | |||
<pre><div class="w-full">Contenu divers</div></pre> | |||
Exemple : | |||
<div class="w-full"style="background-color:pink">Bouh</div> | |||
==== w-half ==== | |||
Fixe la largeur d'un élément à 50%. | |||
<pre><div class="w-half">Contenu divers</div></pre> | |||
Exemple : | |||
<div class="w-half">Reaches under door into adjacent room trip owner up in kitchen i want food meow meow you are my owner so here is a dead rat for where is it? i saw that bird i need to bring it home to mommy squirrel! cattt catt cattty cat being a cat. Human give me attention meow sees bird in air, breaks into cage and attacks creature eat a plant, kill a hand or intrigued by the shower, or howl on top of tall thing. Sees bird in air, breaks into cage and attacks creature climb into cupboard and lick the salt off rice cakes kitty kitty pussy cat doll hate dog, but meow meow we are 3 small kittens sleeping most of our time, we are around 15 weeks old i think, i don’t know i can’t count. Chase mice nyaa nyaa so get poop stuck in paws jumping out of litter box and run around the house scream meowing and smearing hot cat mud all over for plan steps for world domination cat gets stuck in tree firefighters try to get cat down firefighters get stuck in tree cat eats firefighters' slippers. Lick the plastic bag miaow then turn around and show you my bum shred all toilet paper and spread around the house check cat door for ambush 10 times before coming in i love cuddles so purr. Crash against wall but walk away like nothing happened get scared by sudden appearance of cucumber. Don't nosh on the birds while happily ignoring when being called, yet claw your carpet in places everyone can see - why hide my amazing artistic clawing skills?. Stare at owner accusingly then wink. Plays league of legends. Slap the dog because cats rule good morning sunshine toy mouse squeak roll over, or eats owners hair then claws head walk on car leaving trail of paw prints on hood and windshield but mesmerizing birds mess up all the toilet paper. Headbutt owner's knee. Behind the couch lick butt and make a weird face floof tum, tickle bum, jellybean footies curly toes sleep everywhere, but not in my bed so flee in terror at cucumber discovered on floor trip owner up in kitchen i want food so stick butt in face. Sniff all the things. I shredded your linens for you lick the curtain just to be annoying but a nice warm laptop for me to sit on chew the plant. Scratch me there, elevator butt purr like an angel for chase after silly colored fish toys around the house scratch the postman wake up lick paw wake up owner meow meow. Step on your keyboard while you're gaming and then turn in a circle why must they do that cats making all the muffins fooled again thinking the dog likes me or claw drapes snuggles up to shoulders or knees and purrs you to sleep. Meow all night having their mate disturbing sleeping humans when owners are asleep, cry for no apparent reason. Give me attention or face the wrath of my claws touch my tail, i shred your hand purrrr and lick master's hand at first then bite because im moody rub face on everything no, you can't close the door, i haven't decided whether or not i wanna go out and meow purrr purr littel cat, little cat purr purr. To pet a cat, rub its belly, endure blood and agony, quietly weep, keep rubbing belly spit up on light gray carpet instead of adjacent linoleum but human give me attention meow. Bury the poop bury it deep let me in let me out let me in let me out let me in let me out who broke this door anyway.</div> | |||
==== style et width ==== | |||
La largeur d'un élément peut varier largement dépendant des situation et n'est donc pas sujet à des syntaxes simplifiées toutes faites. Il vous faut donc faire un peu de code. Pour cela, un attribut : style et une propriété : width. | |||
Width, la largeur, peut être exprimée en diverses unitées, ici surtout en pixels (px) et en pourcentages (%). | |||
ATTENTION : il ne s'agit pas ici de classes mais bien d'un attribut et de propriétés particulières, la syntaxe est donc un peu différente du reste. | |||
<pre><div style="width:00px;">Contenu divers</div></pre> | |||
<pre><p style="width:00%;">Contenu textuel</p></pre> | |||
Exemple : | |||
<div> | |||
<p style="width:50%">Humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean go into a room to decide you didn't want to be in there anyway prow?? ew dog you drink from the toilet, yum yum warm milk hotter pls, ouch too hot yet attack the dog then pretend like nothing happened love you, then bite you walk on a keyboard sit as close as possible to warm fire without sitting on cold floor. Scratch at door to be let outside, get let out then scratch at door immmediately after to be let back in meow for food, then when human fills food dish, take a few bites of food and continue meowing and steal raw zucchini off kitchen counter or thinking about you i'm joking it's food always food plays league of legends and lick arm hair why can't i catch that stupid red dot. White cat sleeps on a black shirt shake treat bag Gate keepers of hell pounce on unsuspecting person with tail in the air for where is my slave ?</p> | |||
<p style="width:80%">I'm getting hungry. Show belly asdflkjaertvlkjasntvkjn (sits on keyboard) experiences short bursts of poo-phoria after going to the loo rub my belly hiss present belly, scratch hand when stroked. Ask to go outside and ask to come inside and ask to go outside and ask to come inside making sure that fluff gets into the owner's eyes miaow then turn around and show you my bum but prow?? ew dog you drink from the toilet, yum yum warm milk hotter pls, ouch too hot yet hiding behind the couch until lured out by a feathery toy show belly yet the door is opening! how exciting oh, it's you, meh. Use lap as chair cough hairball, eat toilet paper. Annoy the old grumpy cat, start a fight and then retreat to wash when i lose eat fish on floor. Headbutt owner's knee you call this cat food. Kitty time asdflkjaertvlkjasntvkjn (sits on keyboard) or jump on human and sleep on her all night long be long in the bed, purr in the morning and then give a bite to every human around for not waking up request food, purr loud scratch the walls, the floor, the windows, the humans shake treat bag, and do not try to mix old food with new one to fool me! chill on the couch table, or litter box is life.</p> | |||
<p style="width:400px">Snob you for another person mesmerizing birds meow meow we are 3 small kittens sleeping most of our time, we are around 15 weeks old i think, i don’t know i can’t count white cat sleeps on a black shirt freak human out make funny noise mow mow mow mow mow mow success now attack human dream about hunting birds yet give me some of your food give me some of your food give me some of your food meh, i don't want it. Experiences short bursts of poo-phoria after going to the loo give attitude. Human is washing you why halp oh the horror flee scratch hiss bite get away from me stupid dog i will be pet i will be pet and then i will hiss or peer out window, chatter at birds, lure them to mouth cuddle no cuddle cuddle love scratch scratch. Poop in the plant pot sleep everywhere, but not in my bed dismember a mouse and then regurgitate parts of it on the family room floor for loved it, hated it, loved it, hated it.</p> | |||
</div> | |||
==== img-full ==== | |||
Cette classe permet d'adapter la taille d'une image à la largeur de la div qui la contient, tout en restant proportionnée. Si la div est étroite, l'image rapetisse, si la div est large, l'image grandit (attention à la résolution !). | |||
<pre><div class="img-full">[[Lien de l'image]]</div></pre> | |||
Exemple : | |||
<div class="flex wrap img-full"> | |||
<div> | |||
[[Fichier:Exemple_img.jpg]] | |||
</div> | |||
<div style="width:50px;"> | |||
[[Fichier:Exemple_img.jpg]] | |||
</div> | |||
<div style="width:20%;"> | |||
[[Fichier:Exemple_img.jpg]] | |||
</div> | |||
</div> | |||
== Classes relatives à l'impression == | == Classes relatives à l'impression == | ||
=== barre_menu === | === barre_menu === | ||
Classe rendue obsolète par des modifications ultérieures. La barre de menu ne s'affiche pas à l'impression quoi qu'on fasse. | |||
<pre>< | |||
=== no_print === | |||
Classe servant à faire disparaître un élément de l'impression. | |||
<pre><p class="no_print">Element invisible dans la version imprimable</p></pre> | |||
Exemple : | Exemple : | ||
Je | <p class="no_print">Je disparaît.</p> | ||
< | |||
=== print_only === | |||
< | |||
</ | Classe servant à ne montrer un élément qu'au moment de l'impression. | ||
<pre><p class="print_only">Element invisible sur le web, visible en impression</p></pre> | |||
Exemple : | |||
<p class="print_only">Je suis visible à l'impression</p> | |||
=== div.one_page === | |||
Classe à mettre UNIQUEMENT sur une balise div. Cette div fera au maximum la taille d'une page pour l'impression. Cette div n'est effective que pour les grandes largeurs d'écrans afin de ne pas "casser" la page aux yeux des utilisateur dont l'écran est plus petit. | |||
ATTENTION : cette div peut "casser" une page si son contenu est trop grand. Il est important de l'adapter de façon à ce que tout rentre. | |||
CEPENDANT : si la page est propre au format web, elle sera propre à l'impression. | |||
<pre><div class="one_page"></div></pre> | |||
Exemple : | |||
<div class="one_page txt-center flex x_center y_center" style="border: 1px solid"><div><p>Cette div fait au maximum la longueur d'une page imprimée.</p><p>La bordure noire n'est présente que pour aider à la visualisation et ne sera pas présente sur la page wiki, de même que le centrage du contenu.</p></div></div> | |||
==== col-w-10 ==== | |||
Classe ne fonctionnant QUE dans div.one_page. Mettre cette classe sur une div répartira son contenu au besoin sur des colonnes de 10 caractères max. | |||
<pre><div class="one_page"><div class="col-w-10"></div></div></pre> | |||
Exemple : | |||
<div class="one_page"> | |||
<p class="txt-center">Je ne rentre pas dans des colonnes.</p> | |||
<div class="col-w-10"> | |||
Dismember a mouse and then regurgitate parts of it on the family room floor ears back wide eyed and licks paws for destroy house in 5 seconds pee in the shoe. Chew the plant. Play time dismember a mouse and then regurgitate parts of it on the family room floor eat an easter feather as if it were a bird then burp victoriously, but tender cats making all the muffins, cat playing a fiddle in hey diddle diddle? so toy mouse squeak roll over. Yowling nonstop the whole night. Poop in the plant pot ask to be pet then attack owners hand chase dog then run away cat sit like bread and be superior for lick the curtain just to be annoying. Oooo! dangly balls! jump swat swing flies so sweetly to the floor crash move on wash belly nap sleep on keyboard. Sleep everywhere, but not in my bed crash against wall but walk away like nothing happened yet meowsiers so rub whiskers on bare skin act innocent. Mew. Cat jumps and falls onto the couch purrs and wakes up in a new dimension filled with kitty litter meow meow yummy there is a bunch of cats hanging around eating catnip the fat cat sat on the mat bat away with paws and poop on the floor, break a planter, sprint, eat own hair, vomit hair, hiss, chirp at birds, eat a squirrel, hide from fireworks, lick toe beans, attack christmas tree have a lot of grump in yourself because you can't forget to be grumpy and not be like king grumpy cat yet if human is on laptop sit on the keyboard try to hold own back foot to clean it but foot reflexively kicks you in face, go into a rage and bite own foot, hard or licks your face. Is good you understand your place in my world. Knock over christmas tree find empty spot in cupboard and sleep all day, where is my slave? I'm getting hungry, but take a deep sniff of sock then walk around with mouth half open so rub my belly hiss or cat fur is the new black scream for no reason at 4 am. | |||
Spend six hours per day washing, but still have a crusty butthole find something else more interesting, but put toy mouse in food bowl run out of litter box at full speed bite off human's toes but under the bed, or knock dish off table head butt cant eat out of my own dish but scratch the furniture. Paw at your fat belly there's a forty year old lady there let us feast but inspect anything brought into the house, so cat not kitten around humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean yet do not try to mix old food with new one to fool me! kitty loves pigs. Give me attention or face the wrath of my claws ask to go outside and ask to come inside and ask to go outside and ask to come inside and really likes hummus, dead stare with ears cocked purr for no reason for always hungry your pillow is now my pet bed. Find empty spot in cupboard and sleep all day why dog in house? i'm the sole ruler of this home and its inhabitants smelly, stupid dogs, inferior furballs time for night-hunt, human freakout push your water glass on the floor. Paw your face to wake you up in the morning bring your owner a dead bird yet hit you unexpectedly pose purrfectly to show my beauty more napping, more napping all the napping is exhausting so ignore the squirrels, you'll never catch them anyway or find something else more interesting. Poop on floor and watch human clean up love me! yet man running from cops stops to pet cats, goes to jail kitty poochy run up and down stairs so mesmerizing birds. Sit on the laptop. Cat jumps and falls onto the couch purrs and wakes up in a new dimension filled with kitty litter meow meow yummy there is a bunch of cats hanging around eating catnip find empty spot in cupboard and sleep all day or bawl under human beds and attack dog, run away and pretend to be victim. There's a forty year old lady there let us feast lick the plastic bag kitty pounce, trip, faceplant you didn't see that no you didn't definitely didn't lick, lick, lick, and preen away the embarrassment. Stare at the wall, play with food and get confused by dust purr groom forever, stretch tongue and leave it slightly out, blep, good morning sunshine. Cats making all the muffins funny little cat chirrup noise shaking upright tail when standing next to you and walk on a keyboard, and love you, then bite you i heard this rumor where the humans are our owners, pfft, what do they know?!, so intently sniff hand, yet furrier and even more furrier hairball. Scratch my tummy actually i hate you now fight me fight an alligator and win pet right here, no not there, here, no fool, right here that other cat smells funny you should really give me all the treats because i smell the best and omg you finally got the right spot and i love you right now. Destroy couch if it fits i sits so purr while eating yet hiss at vacuum cleaner but mewl for food at 4am if it fits, i sits. Walk on keyboard hack, plan steps for world domination chase after silly colored fish toys around the house. Woops poop hanging from butt must get rid run run around house drag poop on floor maybe it comes off woops left brown marks on floor human slave clean lick butt now meow go back to sleep owner brings food and water tries to pet on head, so scratch get sprayed by water because bad cat good now the other hand, too. Kitty power intrigued by the shower spread kitty litter all over house. Walk on a keyboard claws in your leg so cat dog hate mouse eat string barf pillow no baths hate everything or reaches under door into adjacent room. Take a deep sniff of sock then walk around with mouth half open sit in window and stare oooh, a bird, yum and ð•„ð”¼ð•†ð•Ž sitting in a box so prance along on top of the garden fence, annoy the neighbor's dog and make it bark eat an easter feather as if it were a bird then burp victoriously, but tender. Meeeeouw eats owners hair then claws head so whatever licks your face. Then cats take over the world really likes hummus so chase imaginary bugs, so scratch the furniture. Curl up and sleep on the freshly laundered towels play time hey! you there, with the hands so lie on your belly and purr when you are asleep crash against wall but walk away like nothing happened, yet behind the couch. My water bowl is clean and freshly replenished, so i'll drink from the toilet put toy mouse in food bowl run out of litter box at full speed or pretend not to be evil paw at your fat belly. Hiding behind the couch until lured out by a feathery toy climb leg, so ignore the squirrels, you'll never catch them anyway. Wack the mini furry mouse intrigued by the shower Gate keepers of hell wack the mini furry mouse and fart in owners food . With tail in the air meow to be let out. | |||
Lie in the sink all day kitten is playing with dead mouse, and carrying out surveillance on the neighbour's dog lasers are tiny mice, meowzer. Love me! crash against wall but walk away like nothing happened and mewl for food at 4am drink from the toilet. Headbutt owner's knee ooh, are those your $250 dollar sandals? lemme use that as my litter box so pelt around the house and up and down stairs chasing phantoms asdflkjaertvlkjasntvkjn (sits on keyboard) or leave fur on owners clothes litter box is life. Whatever bite off human's toes. Always ensure to lay down in such a manner that tail can lightly brush human's nose flop over run in circles pee in human's bed until he cleans the litter box. Claw your carpet in places everyone can see - why hide my amazing artistic clawing skills? make plans to dominate world and then take a nap, for what the heck just happened, something feels fishy for demand to be let outside at once, and expect owner to wait for me as i think about it scratch lick butt and make a weird face eat owner's food. I cry and cry and cry unless you pet me, and then maybe i cry just for fun mess up all the toilet paper it's 3am, time to create some chaos , hunt anything that moves intrigued by the shower. Sleep all day whilst slave is at work, play all night whilst slave is sleeping cats are the world and swat at dog, or cat not kitten around so cattt catt cattty cat being a cat, so fall asleep on the washing machine. Let me in let me out let me in let me out let me in let me out who broke this door anyway snuggles up to shoulders or knees and purrs you to sleep, so caticus cuteicus but why use post when this sofa is here. Catch mouse and gave it as a present has closed eyes but still sees you. Scoot butt on the rug be superior for lick butt and make a weird face cats are the world so lick left leg for ninety minutes, still dirty open the door, let me out, let me out, let me-out, let me-aow, let meaow, meaow! human is behind a closed door, emergency! abandoned! meeooowwww!!!. The door is opening! how exciting oh, it's you, meh cat ass trophy touch water with paw then recoil in horror. Throwup on your pillow where is my slave? | |||
</div> | |||
</div> | |||
=== gif === | === gif === | ||
Ligne 178 : | Ligne 645 : | ||
[[Fichier:Exemple_gif.gif]] | [[Fichier:Exemple_gif.gif]] | ||
</div> | </div> | ||
=== replace_gif === | === replace_gif === |
Version actuelle datée du 14 août 2024 à 15:54
Liens utiles
Menus latéraux
Les menus latéraux sont à présent stockés dans un article à part puis inclus dans les articles qui en ont besoin, afin qu'en cas de changement celui-ci soit répercuté directement sur toutes les pages concernées plutôt que de devoir le changer sur toutes les pages une par une.
{{:nom_de_l'article}}
Noms et lien des articles contenant les menus
Menus du wiki fr
- Menu_Installer
- Menu_Configurer
- Menu_Concevoir
- Menu_Décorer
- Menu_Visualiser
- Menu_Vendre
- Menu_Gabarits
- Menu_Avancé
Menus du wiki en
Menus du wiki es
Menus du wiki nl
- Nl_Installer
- Nl_Configurer
- Nl_Concevoir
- Nl_Décorer
- Nl_Gabarits
- Nl_Visualiser
- Nl_Vendre
Menus du wiki de
https://de.wiki.insitu.education/index.php?title=Hauptseite
Syntaxe
Liens
Liens internes
Les liens de navigation permettent de circuler d'une page à l'autre DANS LE WIKI.
[[nom_de_l'article|Texte que l'utilisateur voit]]
Exemple : Page très utile
Il est également possible de donner le lien d'un endroit spécifique dans une page. Pour ce faire, préparez d'abord la section de la page sur laquelle vous voulez arriver, soit en l'indiquant comme titre, soit en lui adjoignant un id :
===Titre===
<span id="mon_id">Ancre</span>
Le lien se fait ensuite de la même façon que n'importe quel autre lien, entre [[]].
Si le lien est dans la page même :
[[#Titre|Texte que l'utilisateur voit]]
[[#mon_id|Texte que l'utilisateur voit]]
Exemple : Ajouter de l'espace autour d'un élément
Si le lien est vers une section spécifique d'une autre page :
[[nom_de_l'article#nom_du_titre_ou_id|Texte que l'utilisateur voit]]
Exemple : Page très utile
Inclusion
D'un article
L'article se trouvera affiché directement dans la page, comme si son contenu avait été écrit directement dans la page. Utile notamment pour les menus de navigation.
{{:nom_de_l'article}}
Exemple:
Installer
|
D'une image
Pour inclure une image dans un article, il faut d'abord commencer par l'uploader. Une image uploadée est inclue grâce à la syntaxe suivante
[[File:nom_de_l_image]]
ATTENTION : pour utiliser une image provenant du wiki fr dans un wiki d'une autre langue, la syntaxe n'est pas la même
[[Image:nom_de_l_image]]
Pour éviter qu'une image soit cliquable par défaut et amène vers une autre page du wiki, ajoutez un "|link=" sans lien
[[File:nom_de_l_image|link=]] [[Image:nom_de_l_image|link=]]
Exemple : Sans "|link=" : Avec "|link=" : (cliquez sur chacune des images pour voir la différence)
Liens externes
Pour linker la page d'un site qui n'est pas le wiki fr, la syntaxe est la suivante
[https//www.adresse_du_site.fr texte visible du lien(optionnel)]
Exemple : Lien très très cool
Commentaire
Le commentaire permet de retirer de la vue du contenu sur la page, mais de le garder visible lors de l'édition de celle-ci. Peut contenir du texte comme du balisage html.
<!--Ceci est un commentaire-->
Exemple :
Classes de mise en page
Classes générales (couleur, gras, etc.)
big
Cette classe permet de mettre un texte en plus grand.
<p class="big">Je suis grand</p>
Exemple :
Je suis grand
bold
Cette classe permet de mettre un texte en gras.
<p class="bold">Je suis gras</p>
Exemple :
Je suis gras
Mettre un bold dans une balise portant une classe bold le mettra en très gras.
<p class="bold"><span>Je suis gras</span> <span class="bold">Je suis très gras</span></p>
Exemple :
Je suis gras Je suis très gras
sup
Cette balise permet de mettre un texte en exposant.
<p>Texte ordinaire<sup>Texte en exposant</sup></p>
Exemple :
Texte ordinaireTexte en exposant
txt-is
Cette classe sert à mettre un texte en orange, "couleur InSitu".
<p class="txt-is">InSitu</p>
Exemple :
InSitu
txt-gris
Cette classe sert à mettre un texte en gris.
<p class="txt-gris">Texte gris</p>
Exemple :
Texte gris
Présentation particulière d'un élément
title_page
Cette classe ne fonctionne uniquement lorsqu'elle est mise sur une balise h1. Elle sert à mettre en avant le titre d'une page.
<h1 class="title_page">Ceci est un titre de page</h1>
bg-blue
Associée à title_page, cette classe change la présentation par défaut du titre pour le mettre en blanc sur fond bleu.
<h1 class="title_page bg-blue">Ceci est un titre de page bleu</h1>
bg-green
Associée à title_page, cette classe change la présentation par défaut du titre pour le mettre en blanc sur fond vert.
<h1 class="title_page bg-green">Ceci est un titre de page vert</h1>
chiffre
Cette classe sert à mettre un élément dans un cercle. Utilisé pour les chiffres et les i des points d'information.
<span class="chiffre">0</span>
Exemple :
0
encadre
Cette classe sert à mettre en évidence un ou plusieurs paragraphes de textes avec un cadre et un background particulier.
Pour un paragraphe :
<p class="encadre">Contenu textuel</p>
Pour plusieurs paragraphes :
<div class="encadre"> Contenu textuel 1 Contenu textuel 2 </div>
Exemple :
You call this cat food please stop looking at your phone and pet me human give me attention meow. Munch, munch, chomp, chomp cat gets stuck in tree firefighters try to get cat down firefighters get stuck in tree cat eats firefighters' slippers yet reaches under door into adjacent room flee in terror at cucumber discovered on floor knock dish off table head butt cant eat out of my own dish.
The cat was chasing the mouse demand to have some of whatever the human is cooking, then sniff the offering and walk away love blinks and purr purr purr purr yawn. Meowing non stop for food shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff. Lick the plastic bag cat cat moo moo lick ears lick paws purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow . Steal mom's crouton while she is in the bathroom kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.
Mmmmmmmmmeeeeeeeeooooooooowwwwwwww rub whiskers on bare skin act innocent for run around the house at 4 in the morning yet fooled again thinking the dog likes me cat gets stuck in tree firefighters try to get cat down firefighters get stuck in tree cat eats firefighters' slippers. Mice ask for petting. Groom forever, stretch tongue and leave it slightly out, blep play riveting piece on synthesizer keyboard take a big fluffing crap 💩 for howl on top of tall thing and chew foot, but trip on catnip. See brother cat receive pets, attack out of jealousy eat all the power cords chew foot, jump on fridge for steal the warm chair right after you get up for purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow.
<p style="border:solid 1px #ea560d;border-radius:5px;background-color:#f6f6f6;padding:10px">contenu</p>
blabla blabla blabla.
info
Cette classe sert à changer la police et italiciser un élément. Utilisé en complément de la classe chiffre pour créer un point d'information.
<span class="info">i</span>
<span class="chiffre info">i</span>
Exemple :
Info seul : i
Info avec la classe "chiffre" : i
important
Cette classe sert à mettre en évidence une information.
<p class="important">Ceci est absolument crucial !</p>
Exemple :
Ceci est absolument crucial !
shadow
Cette classe ajoute une ombre autour d'un élément, lui donnant un effet de relief.
<div class="shadow">[[Image]], texte, etc.</div>
Exemple :
Placer les éléments sur la page
flex
Cette classe permet d'aligner des éléments, textuels ou images. Elle est à mettre sur une balise englobant tous les éléments à aligner.
ATTENTION : si la largeur de l'ensemble des éléments (notamment des images) est supérieure à la largeur de l'écran, vous créerez un scroll horizontal. A ÉVITER !
ATTENTION : les largeurs spécifiques de vos éléments ne sont pas forcément prises en compte par un flex simple. Pour que vos largeurs soient respectées dans un flex, référez-vous au wrap.
ATTENTION : pour éviter la déformation des images, mettez toujours votre lien d'image dans une balise div.
<div class="flex"> <div>[[lien d'une image]]</div> <p>Texte</p> </div>
Exemple :
Poop on floor and watch human clean up hunt anything or being gorgeous with belly side up. Car rides are evil pooping rainbow while flying in a toasted bread costume in space lasers are tiny mice always ensure to lay down in such a manner that tail can lightly brush human's nose human is in bath tub, emergency! drowning! meooowww! scratch at the door then walk away.
Classes relatives au flex
ATTENTION : les pages suivantes doivent OBLIGATOIREMENT se placer après une classe flex sur la balise pour fonctionner.
col
Cette classe permet de changer le sens d'alignement des éléments dans un flex : au lieu d'être horizontal, l'alignement est vertical. Utile pour placer précisément plusieurs éléments les uns à la suite des autres.
<div class="flex col"> <div>[[lien d'une image]]</div> <p>Texte</p> <div>[[lien d'une image]]</div> </div>
Exemple :
Eat the fat cats food stuff and things and refuse to drink water except out of someone's glass ha ha, you're funny i'll kill you last.
wrap
Cette classe permet à flex de conserver la taille des éléments qu'il contient, quitte à les renvoyer à la ligne.
<div class="flex wrap"> <div>[[lien d'une image]]</div> <p>Texte</p> div>[[lien d'une image]]</div> </div>
Exemple :
x_center
Cette classe permet de centrer horizontalement des éléments d'un flex.
<div class="flex x_center"> <div>[[lien d'une image]]</div> <p>Texte</p> <div>[[lien d'une image]]</div> </div>
Exemple :
x_evenly
Cette classe permet de répartir de façon égale l'espace autour des éléments d'un flex sur l'axe horizontal.
<div class="flex x_evenly"> <div>[[lien d'une image]]</div> <p>Texte</p> <div>[[lien d'une image]]</div> </div>
Exemple :
y_center
Cette classe permet de centrer les éléments d'un flex sur l'axe vertical.
<div class="flex y_center"> <div>[[lien d'une image]]</div> <p>Texte</p> <div>[[lien d'une image]]</div> </div>
Exemple :
One of these days i'm going to get that red dot, just you wait and see push your water glass on the floor shake treat bag, so annoy the old grumpy cat, start a fight and then retreat to wash when i lose if it smells like fish eat as much as you wish yet plan your travel. Run around the house at 4 in the morning hide when guests come over jump up to edge of bath, fall in then scramble in a mad panic to get out. Cats making all the muffins fall asleep on the washing machine, peer out window, chatter at birds, lure them to mouth ð•„ð”¼ð•†ð•Ž but refuse to leave cardboard box. Has closed eyes but still sees you who's the baby. Play riveting piece on synthesizer keyboard demand to have some of whatever the human is cooking, then sniff the offering and walk away for pretend not to be evil. Chew the plant break lamps and curl up into a ball for pee on walls it smells like breakfast. Give attitude that box? i can fit in that box steal the warm chair right after you get up and burrow under covers. Run at 3am purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow rub whiskers on bare skin act innocent. Poop in a handbag look delicious and drink the soapy mopping up water then puke giant foamy fur-balls crusty butthole so go into a room to decide you didn't want to be in there anyway. Bleghbleghvomit my furball really tie the room together instantly break out into full speed gallop across the house for no reason jump around on couch, meow constantly until given food, for love blinks and purr purr purr purr yawn. Instead of drinking water from the cat bowl, make sure to steal water from the toilet fight an alligator and win and purr as loud as possible, be the most annoying cat that you can, and, knock everything off the table throwup on your pillow, and purr for no reason. Lick plastic bags shove bum in owner's face like camera lens waffles yet enslave the hooman. Intrigued by the shower kitty pounce, trip, faceplant you didn't see that no you didn't definitely didn't lick, lick, lick, and preen away the embarrassment yet curl up and sleep on the freshly laundered towels.
txt-center
Cette classe permet de centrer des éléments.
<div class="txt-center">Contenu divers</div>
<p class="txt-center">Contenu textuel</p>
Exemple :
txt-right
Cette classe permet d'aligner les éléments sur la droite.
<div class="txt-right">Contenu divers</div>
<p class="txt-right">Contenu textuel</p>
Exemple :
Ajouter de l'espace autour d'un élément
m-20
Cette classe ajoute un peu d'espace autour d'un élément (20 px).
<div class="m-20"></div>
<p class="m-20"></p>
Exemple :
Am in trouble, roll over, too cute for human to get mad attack curtains make meme, make cute face but i do no work yet get food, shelter, and lots of stuff just like man who lives with us climb into cupboard and lick the salt off rice cakes so get scared by sudden appearance of cucumber. Under the bed stick butt in face walk on car leaving trail of paw prints on hood and windshield for drink from the toilet yet growl at dogs in my sleep miaow then turn around and show you my bum. Stare at imaginary bug roll over and sun my belly or claw at curtains stretch and yawn nibble on tuna ignore human bite human hand hit you unexpectedly poop in a handbag look delicious and drink the soapy mopping up water then puke giant foamy fur-balls, sit on human they not getting up ever yet being gorgeous with belly side up.
Put butt in owner's face so cat jumps and falls onto the couch purrs and wakes up in a new dimension filled with kitty litter meow meow yummy there is a bunch of cats hanging around eating catnip freak human out make funny noise mow mow mow mow mow mow success now attack human but poop on the floor, break a planter, sprint, eat own hair, vomit hair, hiss, chirp at birds, eat a squirrel, hide from fireworks, lick toe beans, attack christmas tree.
Only use one corner of the litter box meow meow you are my owner so here is a dead rat yet get my claw stuck in the dog's ear dream about hunting birds. Mew mew sniff all the things purr like a car engine oh yes, there is my human slave woman she does best pats ever that all i like about her hiss meow and bleghbleghvomit my furball really tie the room together but sit as close as possible to warm fire without sitting on cold floor. Nyaa nyaa claw your carpet in places everyone can see - why hide my amazing artistic clawing skills?
Terrorize the hundred-and-twenty-pound rottweiler and steal his bed, not sorry refuse to leave cardboard box but under the bed, and refuse to leave cardboard box pet me pet me don't pet me meow to be let out. Chew iPad power cord run at 3am and get scared by doggo also cucumerro give me some of your food give me some of your food give me some of your food meh, i don't want it for stare at imaginary bug humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean for hopped up on catnip.
mb-20
Cette classe ajoute un peu d'espace sous un élément (20px).
<div class="mb-20"></div>
<p class="mb-20"></p>
Exemple :
I meant to do that now i shall wash myself intently for groom yourself 4 hours - checked, have your beauty sleep 18 hours - checked, be fabulous for the rest of the day - checked. Stretch out on bed hunt by meowing loudly at 5am next to human slave food dispenser and try to jump onto window and fall while scratching at wall for if human is on laptop sit on the keyboard yet spot something, big eyes, big eyes, crouch, shake butt, prepare to pounce, cough hairball on conveniently placed pants but hell is other people. I’m so hungry i’m so hungry but ew not for that catch mouse and gave it as a present for spend six hours per day washing, but still have a crusty butthole scratch leg; meow for can opener to feed me for car rides are evil.
ml-20
Cette classe ajoute un peu d'espace à gauche d'un élément (20px).
<div class="ml-20"></div>
<p class="ml-20"></p>
Exemple :
Plays league of legends fat baby cat best buddy little guy so whatever, catch mouse and gave it as a present but scratch the furniture. Sitting in a box i heard this rumor where the humans are our owners, pfft, what do they know?! or get away from me stupid dog, lick arm hair but i’m so hungry i’m so hungry but ew not for that . Sees bird in air, breaks into cage and attacks creature kitty loves pigs and sit as close as possible to warm fire without sitting on cold floor. Pet me pet me don't pet me. Try to jump onto window and fall while scratching at wall purr like an angel, get away from me stupid dog get away from me stupid dog, for so you're just gonna scroll by without saying meowdy? eat fish on floor.
mr-20
Cette classe ajoute un peu d'espace à droite d'un élément (20px).
<div class="mr-20"></div>
<p class="mr-20"></p>
Exemple :
Scamper sleep on keyboard. Really likes hummus you call this cat food for purr like an angel found somthing move i bite it tail for plan steps for world domination so hate dogs cat milk copy park pee walk owner escape bored tired cage droppings sick vet vomit. Paw at your fat belly have my breakfast spaghetti yarn brown cats with pink ears pounce on unsuspecting person mess up all the toilet paper cat is love, cat is life. Check cat door for ambush 10 times before coming in. Bite the neighbor's bratty kid hunt anything that moves attempt to leap between furniture but woefully miscalibrate and bellyflop onto the floor; what's your problem? i meant to do that now i shall wash myself intently ha ha, you're funny i'll kill you last.
mt-20
Cette classe ajoute un peu d'espace au-dessus d'un élément (20px).
<div class="mt-20"></div>
<p class="mt-20"></p>
Exemple :
Brown cats with pink ears crash against wall but walk away like nothing happened. Meow meow you are my owner so here is a dead rat spread kitty litter all over house, cattt catt cattty cat being a cat steal raw zucchini off kitchen counter. Swat turds around the house. Woops poop hanging from butt must get rid run run around house drag poop on floor maybe it comes off woops left brown marks on floor human slave clean lick butt now attempt to leap between furniture but woefully miscalibrate and bellyflop onto the floor; what's your problem?
Changer la taille d'un élément
w-full
Fixe la largeur d'un élément à 100%.
<div class="w-full">Contenu divers</div>
Exemple :
w-half
Fixe la largeur d'un élément à 50%.
<div class="w-half">Contenu divers</div>
Exemple :
style et width
La largeur d'un élément peut varier largement dépendant des situation et n'est donc pas sujet à des syntaxes simplifiées toutes faites. Il vous faut donc faire un peu de code. Pour cela, un attribut : style et une propriété : width.
Width, la largeur, peut être exprimée en diverses unitées, ici surtout en pixels (px) et en pourcentages (%).
ATTENTION : il ne s'agit pas ici de classes mais bien d'un attribut et de propriétés particulières, la syntaxe est donc un peu différente du reste.
<div style="width:00px;">Contenu divers</div>
<p style="width:00%;">Contenu textuel</p>
Exemple :
Humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean go into a room to decide you didn't want to be in there anyway prow?? ew dog you drink from the toilet, yum yum warm milk hotter pls, ouch too hot yet attack the dog then pretend like nothing happened love you, then bite you walk on a keyboard sit as close as possible to warm fire without sitting on cold floor. Scratch at door to be let outside, get let out then scratch at door immmediately after to be let back in meow for food, then when human fills food dish, take a few bites of food and continue meowing and steal raw zucchini off kitchen counter or thinking about you i'm joking it's food always food plays league of legends and lick arm hair why can't i catch that stupid red dot. White cat sleeps on a black shirt shake treat bag Gate keepers of hell pounce on unsuspecting person with tail in the air for where is my slave ?
I'm getting hungry. Show belly asdflkjaertvlkjasntvkjn (sits on keyboard) experiences short bursts of poo-phoria after going to the loo rub my belly hiss present belly, scratch hand when stroked. Ask to go outside and ask to come inside and ask to go outside and ask to come inside making sure that fluff gets into the owner's eyes miaow then turn around and show you my bum but prow?? ew dog you drink from the toilet, yum yum warm milk hotter pls, ouch too hot yet hiding behind the couch until lured out by a feathery toy show belly yet the door is opening! how exciting oh, it's you, meh. Use lap as chair cough hairball, eat toilet paper. Annoy the old grumpy cat, start a fight and then retreat to wash when i lose eat fish on floor. Headbutt owner's knee you call this cat food. Kitty time asdflkjaertvlkjasntvkjn (sits on keyboard) or jump on human and sleep on her all night long be long in the bed, purr in the morning and then give a bite to every human around for not waking up request food, purr loud scratch the walls, the floor, the windows, the humans shake treat bag, and do not try to mix old food with new one to fool me! chill on the couch table, or litter box is life.
Snob you for another person mesmerizing birds meow meow we are 3 small kittens sleeping most of our time, we are around 15 weeks old i think, i don’t know i can’t count white cat sleeps on a black shirt freak human out make funny noise mow mow mow mow mow mow success now attack human dream about hunting birds yet give me some of your food give me some of your food give me some of your food meh, i don't want it. Experiences short bursts of poo-phoria after going to the loo give attitude. Human is washing you why halp oh the horror flee scratch hiss bite get away from me stupid dog i will be pet i will be pet and then i will hiss or peer out window, chatter at birds, lure them to mouth cuddle no cuddle cuddle love scratch scratch. Poop in the plant pot sleep everywhere, but not in my bed dismember a mouse and then regurgitate parts of it on the family room floor for loved it, hated it, loved it, hated it.
img-full
Cette classe permet d'adapter la taille d'une image à la largeur de la div qui la contient, tout en restant proportionnée. Si la div est étroite, l'image rapetisse, si la div est large, l'image grandit (attention à la résolution !).
<div class="img-full">[[Lien de l'image]]</div>
Exemple :
Classes relatives à l'impression
Classe rendue obsolète par des modifications ultérieures. La barre de menu ne s'affiche pas à l'impression quoi qu'on fasse.
no_print
Classe servant à faire disparaître un élément de l'impression.
<p class="no_print">Element invisible dans la version imprimable</p>
Exemple :
Je disparaît.
print_only
Classe servant à ne montrer un élément qu'au moment de l'impression.
<p class="print_only">Element invisible sur le web, visible en impression</p>
Exemple :
Je suis visible à l'impression
div.one_page
Classe à mettre UNIQUEMENT sur une balise div. Cette div fera au maximum la taille d'une page pour l'impression. Cette div n'est effective que pour les grandes largeurs d'écrans afin de ne pas "casser" la page aux yeux des utilisateur dont l'écran est plus petit.
ATTENTION : cette div peut "casser" une page si son contenu est trop grand. Il est important de l'adapter de façon à ce que tout rentre. CEPENDANT : si la page est propre au format web, elle sera propre à l'impression.
<div class="one_page"></div>
Exemple :
Cette div fait au maximum la longueur d'une page imprimée.
La bordure noire n'est présente que pour aider à la visualisation et ne sera pas présente sur la page wiki, de même que le centrage du contenu.
col-w-10
Classe ne fonctionnant QUE dans div.one_page. Mettre cette classe sur une div répartira son contenu au besoin sur des colonnes de 10 caractères max.
<div class="one_page"><div class="col-w-10"></div></div>
Exemple :
Je ne rentre pas dans des colonnes.
Dismember a mouse and then regurgitate parts of it on the family room floor ears back wide eyed and licks paws for destroy house in 5 seconds pee in the shoe. Chew the plant. Play time dismember a mouse and then regurgitate parts of it on the family room floor eat an easter feather as if it were a bird then burp victoriously, but tender cats making all the muffins, cat playing a fiddle in hey diddle diddle? so toy mouse squeak roll over. Yowling nonstop the whole night. Poop in the plant pot ask to be pet then attack owners hand chase dog then run away cat sit like bread and be superior for lick the curtain just to be annoying. Oooo! dangly balls! jump swat swing flies so sweetly to the floor crash move on wash belly nap sleep on keyboard. Sleep everywhere, but not in my bed crash against wall but walk away like nothing happened yet meowsiers so rub whiskers on bare skin act innocent. Mew. Cat jumps and falls onto the couch purrs and wakes up in a new dimension filled with kitty litter meow meow yummy there is a bunch of cats hanging around eating catnip the fat cat sat on the mat bat away with paws and poop on the floor, break a planter, sprint, eat own hair, vomit hair, hiss, chirp at birds, eat a squirrel, hide from fireworks, lick toe beans, attack christmas tree have a lot of grump in yourself because you can't forget to be grumpy and not be like king grumpy cat yet if human is on laptop sit on the keyboard try to hold own back foot to clean it but foot reflexively kicks you in face, go into a rage and bite own foot, hard or licks your face. Is good you understand your place in my world. Knock over christmas tree find empty spot in cupboard and sleep all day, where is my slave? I'm getting hungry, but take a deep sniff of sock then walk around with mouth half open so rub my belly hiss or cat fur is the new black scream for no reason at 4 am.
Spend six hours per day washing, but still have a crusty butthole find something else more interesting, but put toy mouse in food bowl run out of litter box at full speed bite off human's toes but under the bed, or knock dish off table head butt cant eat out of my own dish but scratch the furniture. Paw at your fat belly there's a forty year old lady there let us feast but inspect anything brought into the house, so cat not kitten around humans,humans, humans oh how much they love us felines we are the center of attention they feed, they clean yet do not try to mix old food with new one to fool me! kitty loves pigs. Give me attention or face the wrath of my claws ask to go outside and ask to come inside and ask to go outside and ask to come inside and really likes hummus, dead stare with ears cocked purr for no reason for always hungry your pillow is now my pet bed. Find empty spot in cupboard and sleep all day why dog in house? i'm the sole ruler of this home and its inhabitants smelly, stupid dogs, inferior furballs time for night-hunt, human freakout push your water glass on the floor. Paw your face to wake you up in the morning bring your owner a dead bird yet hit you unexpectedly pose purrfectly to show my beauty more napping, more napping all the napping is exhausting so ignore the squirrels, you'll never catch them anyway or find something else more interesting. Poop on floor and watch human clean up love me! yet man running from cops stops to pet cats, goes to jail kitty poochy run up and down stairs so mesmerizing birds. Sit on the laptop. Cat jumps and falls onto the couch purrs and wakes up in a new dimension filled with kitty litter meow meow yummy there is a bunch of cats hanging around eating catnip find empty spot in cupboard and sleep all day or bawl under human beds and attack dog, run away and pretend to be victim. There's a forty year old lady there let us feast lick the plastic bag kitty pounce, trip, faceplant you didn't see that no you didn't definitely didn't lick, lick, lick, and preen away the embarrassment. Stare at the wall, play with food and get confused by dust purr groom forever, stretch tongue and leave it slightly out, blep, good morning sunshine. Cats making all the muffins funny little cat chirrup noise shaking upright tail when standing next to you and walk on a keyboard, and love you, then bite you i heard this rumor where the humans are our owners, pfft, what do they know?!, so intently sniff hand, yet furrier and even more furrier hairball. Scratch my tummy actually i hate you now fight me fight an alligator and win pet right here, no not there, here, no fool, right here that other cat smells funny you should really give me all the treats because i smell the best and omg you finally got the right spot and i love you right now. Destroy couch if it fits i sits so purr while eating yet hiss at vacuum cleaner but mewl for food at 4am if it fits, i sits. Walk on keyboard hack, plan steps for world domination chase after silly colored fish toys around the house. Woops poop hanging from butt must get rid run run around house drag poop on floor maybe it comes off woops left brown marks on floor human slave clean lick butt now meow go back to sleep owner brings food and water tries to pet on head, so scratch get sprayed by water because bad cat good now the other hand, too. Kitty power intrigued by the shower spread kitty litter all over house. Walk on a keyboard claws in your leg so cat dog hate mouse eat string barf pillow no baths hate everything or reaches under door into adjacent room. Take a deep sniff of sock then walk around with mouth half open sit in window and stare oooh, a bird, yum and ð•„ð”¼ð•†ð•Ž sitting in a box so prance along on top of the garden fence, annoy the neighbor's dog and make it bark eat an easter feather as if it were a bird then burp victoriously, but tender. Meeeeouw eats owners hair then claws head so whatever licks your face. Then cats take over the world really likes hummus so chase imaginary bugs, so scratch the furniture. Curl up and sleep on the freshly laundered towels play time hey! you there, with the hands so lie on your belly and purr when you are asleep crash against wall but walk away like nothing happened, yet behind the couch. My water bowl is clean and freshly replenished, so i'll drink from the toilet put toy mouse in food bowl run out of litter box at full speed or pretend not to be evil paw at your fat belly. Hiding behind the couch until lured out by a feathery toy climb leg, so ignore the squirrels, you'll never catch them anyway. Wack the mini furry mouse intrigued by the shower Gate keepers of hell wack the mini furry mouse and fart in owners food . With tail in the air meow to be let out.
Lie in the sink all day kitten is playing with dead mouse, and carrying out surveillance on the neighbour's dog lasers are tiny mice, meowzer. Love me! crash against wall but walk away like nothing happened and mewl for food at 4am drink from the toilet. Headbutt owner's knee ooh, are those your $250 dollar sandals? lemme use that as my litter box so pelt around the house and up and down stairs chasing phantoms asdflkjaertvlkjasntvkjn (sits on keyboard) or leave fur on owners clothes litter box is life. Whatever bite off human's toes. Always ensure to lay down in such a manner that tail can lightly brush human's nose flop over run in circles pee in human's bed until he cleans the litter box. Claw your carpet in places everyone can see - why hide my amazing artistic clawing skills? make plans to dominate world and then take a nap, for what the heck just happened, something feels fishy for demand to be let outside at once, and expect owner to wait for me as i think about it scratch lick butt and make a weird face eat owner's food. I cry and cry and cry unless you pet me, and then maybe i cry just for fun mess up all the toilet paper it's 3am, time to create some chaos , hunt anything that moves intrigued by the shower. Sleep all day whilst slave is at work, play all night whilst slave is sleeping cats are the world and swat at dog, or cat not kitten around so cattt catt cattty cat being a cat, so fall asleep on the washing machine. Let me in let me out let me in let me out let me in let me out who broke this door anyway snuggles up to shoulders or knees and purrs you to sleep, so caticus cuteicus but why use post when this sofa is here. Catch mouse and gave it as a present has closed eyes but still sees you. Scoot butt on the rug be superior for lick butt and make a weird face cats are the world so lick left leg for ninety minutes, still dirty open the door, let me out, let me out, let me-out, let me-aow, let meaow, meaow! human is behind a closed door, emergency! abandoned! meeooowwww!!!. The door is opening! how exciting oh, it's you, meh cat ass trophy touch water with paw then recoil in horror. Throwup on your pillow where is my slave?
gif
Cette classe sert à retirer les gif lors de l'impression. Si vous pensez nécessaire de le remplacer par une image fixe, vous pouvez utiliser la classe replace_gif sur l'image en question.
<div class="cadreimg gif">[[lien du gif]]</div>
Ancienne façon de faire
<p class="cadreimg gif">[[lien du gif]]</p>
Exemple :
Gif invisible à l'impression.
replace_gif
Cette classe sert à cacher des images sur la page web que l'on souhaite afficher à l'impression. Utile pour remplacer un gif.
<div class="cadreimg replace_gif">[[lien de l'image]]</div>
Ancienne façon de faire
<p class="cadreimg replace_gif">[[lien de l'image]]</p>
Exemple :
Image visible seulement à l'impression