Pour Flammy :)

Je me permets de poster ici avec l'autorisation de la fondatrice ^^'

Première Partie

Pour la première partie, on va apprendre les div :

Donc, il va d'abord falloir créer ce que l'on appelle un "div". C'est une sorte de boîte, et ça sert beaucoup beaucoup !

Code:

<div>Ton texte</div>

Ce qui donne :



Tu le remarqueras, cela ne fait rien. Nous allons donc ajouter un code qui dit que : "Tout ce qui trouve entre et devra avoir une image comme fond".

Code:

<div style="background-image: url('LIEN DE L'IMAGE');">Ton texte</div>

Ce qui donne, par exemple :




Il te suffit de mettre le lien de l'image, sans enlever les ' Si tu ne sais pas comment mettre le lien d'une image, dis le moi, je t'expliquera
Après, il se peut que tu veuille juste mettre une couleur. Le code est différent :

Code:

<div style="background-color: COULEUR;">Ton texte</div>

Ce qui donnerais, par exemple :



Et voilà ton texte sur un fond rouge ! Tu peux changer les couleurs comme tu veux, soit en mettant le nom de la couleur en anglais, soit en allant sur ce site : [Vous devez être inscrit et connecté pour voir ce lien]
Euh... J'espère que tu as compris, si jamais tu as des questions....

Deuxième Partie

Bon, je propose de t'apprendre les bordures (très utiles)
On va reprendre notre div :

Code:

<div>Texte</div>

Mais cette fois, au lieu de mettre background, nous allons mettre border :

Code:

<div style="border: STYLE COULEUR ET TAILLE DE LA BORDURE;">Texte</div>

Il y a plusieurs style de bordures :- none, aucune bordure,
- dotted, bordure en pointillé (sauf internet explorer),
- dashed, bordure en tirets (sauf internet explorer),
- solid, bordure continue,
- double, bordure en double trait,
- groove, bordure en creux,
- ridge, bordure en saillie

Je ne sais pas ce qu'est une bordure en saillie donc il faudra tester
Tu peux choisir n'importe quelle couleur.
La taille (ou largeur) de la bordure s'affiche en pixels .
Voyons comment intégrer une bordure simple, noir et large de 3 px :

Code:

<div style="border: solid black 3px;">Texte</div>

*

Ce qui donne :



Tu peux changer l'ordre des "propriétés" de la bordure. Exemple :

Code:

<div style="3px solid black;">Texte</div>

Ça marche pareil
Voilà ! Tu sais créer une bordure ! Dernière petite astuce pour avoir les coins en arrondis. On reprend notre div et on va rajouter "border-radius: 20px"

Code:

<div style="border: 3px solid black; border-radius: 20px;">Texte</div>

Ce qui donne ceci :



Tu peux changer le nombre. Si tu mets 5px, ce sera un tout petit arrondi alors que si tu mets 50px, l'arrondi sera beaucoup plus grand !
Bon, c'est tout pour le moment mais j'éditerais au fur et à mesure :)
Si t'as des questions, poses les moi

Ok... Ça fait beaucoup de choses à retenir, d'un coup. Mais j'y arrive ! :D
En tout cas, merci, et vive la suite !

Ah ! J'ai une question ! Pour les angles, il y a des limites de px ?

Je crois pas :/
A vérifier tout de même.
M'enfin, si tu met des limites de tailles pour ton div et que les angles sont plus grands, je pense que soit ton div s'agrandit automatiquement, soit l'arrondis du bas est coupé. Il faudrait tester :)

Okey ! (:

Et... Les bordures, c'est obligé qu'elles soient aussi marquées ? Enfin comme si elles étaient en gras ?