DocModif
Liens utiles
Pour uploader des images : Spécial:Téléverser
Classes de mise en page
chiffre
Cette classe sert à mettre un chiffre dans un cercle.
<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.
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, leur taille diminuera en proportion.
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.
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 :
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.
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 :
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.
Classes relatives à l'impression
Cette classe sert à camoufler la barre latérale lors de l'impression.
<table width="100%" class="barre_menu">[...]</table>
Exemple :
Je suis visible à l'impression
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