DocModif

De WikInSituFr
Aller à la navigation Aller à la recherche

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 :

Exemple img.jpg

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 :

Exemple img.jpg

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.

Exemple img.jpg

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 :

Exemple img.jpg
Exemple img.jpg
Exemple img.jpg

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 :

Exemple img.jpg
Exemple img.jpg
Exemple img.jpg

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 :

Exemple img.jpg

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.

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.

Exemple img.jpg

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.

Classes relatives à l'impression

barre_menu

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

  • Je suis invisible à l'impression
  • Je suis invisible à l'impression
  • Je suis invisible à 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.

Exemple gif.gif

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

Exemple img.jpg