Cour Html N°1 | Débutant |

Voir le sujet précédent Voir le sujet suivant Aller en bas

Cour Html N°1 | Débutant |

Message par GreenNazareth le Mar 7 Jan - 3:19


COUR DE CODAGE N°1


Voila ton premier cour de Codage Smile! Comme ça une fois que tu maitriseras les bases du HTML tu n'auras plus besoin de créditer les divers forums ou codeurs. Je fais cela sur demande de pas mal de membres, mais évidement tout le monde est le bienvenue !

Tout d'abords le codage c'est quoi ?

  • Et bien le codage c'est savoir écrire à la base en HTML. Tu connais les balise du BBcode [b*][/b*] déjà je suppose... et bien ça c'est aussi du codage, très basique mais ça se présente sous la même forme. Par forme j'entends que tu as une balise d'ouverture [b*] et une balise de fermeture [/b*]. Il existe énormément de langage pour coder, mais nous on va s'intéresser surtout au HTML qui permet de faire de jolie présentation sur le forum.


C'est cool... bon on commence ?

  • Alors avant de commencer tu dois savoir que la balise qui te permet de donner du style à ta feuille s'appelle <*Div style"=ton code à mettre ici"*> et que sa balise de fermeture est <*/div*>. Chaque partie de votre codage dois être séparé par " ; " et la fin de votre balise ce termine par un ". Maintenant que tu sais cela on va pouvoir commencer avec de la pratique directement.

COURS N°1


Voici ce que vous devrez obtenir à la fin de la première étape.Comme dis précédemment, un codage en HTML de type Style commence toujours par la balise <*Div style=" Ici le reste de votre codage*>... et fini par <*/div*>. Je vais donc vous détailler le corps même du codage, en vous donnant les clefs.


LES BASES A SAVOIR

Background-color: #Code Hexa ou Nom de la couleur
Ceci de toute évidence vous permet de modifier la couleur de votre  arrière plan (autrement dit background). Celle ci sera alors présente dans l'intégralité de votre cadre.

color: #Code Hexa ou Nom de la couleur
Ceci de toute évidence vous permet de modifier la couleur de votre  police (autrement dit de l'écriture). Celle ci sera alors présente dans l'intégralité de votre cadre.

Width: Chiffrepx ou chiffre% ou auto
Ceci détermine la largeur de votre Cadre. Il faut savoir que si vous ignorez la taille en largeur d'un forum, mieux vos utiliser les % ou le Auto. Si vous utilisez Chiffrepx, le cadre prendra la dimension ordonné en pixel, si vous mettez chiffre% votre cadre occupera le pourcentage du corps de message ordonné et si vous mettez auto celui ci occupera la totalité de l'espace disponible. [Astuce : Perso j'utilise pour le " premier cadre " la notion % qui permet par exemple de ne pas déformer les pages]

Height: Chiffrepx ou chiffre% ou auto
Ceci détermine la longueur de votre Cadre. Il faut savoir que si vous ignorez la taille en largeur d'un forum, mieux vos utiliser les % ou le Auto. Si vous utilisez Chiffrepx, le cadre prendra la dimension ordonné en pixel, si vous mettez chiffre% votre cadre occupera le pourcentage du corps de message ordonné et si vous mettez auto celui ci occupera la totalité de l'espace disponible. [Astuce : Perso j'utilise pour le " premier cadre " la notion auto qui permet de ne pas avoir à régler la taille de mes codages à chaque fois que j'utilise ce code là pour diverse choses]

Text-align: valeur
Vous devais remplacer Valeur par left, center, right ou justify. Ceci appliquera le positionnement du texte à tout votre cadre.

Border: chiffre-d'épaisseurpx Statut #code Hexa ou nom de la couleur
Alors attention... le border c'est long à expliquer ! Tout d'abord le Chiffre d'épaisseur c'est pour définir... ET OUI l'épaisseur de votre bordure ! Ensuite vient le Statut... ceci définit l'apparence de votre bordure qui peut être solid ( un trait droit ), Dotted ( des point ), dashed ( des traits ), outset ( sorte de cadre intérieur ), inset ( sorte de cadre extérieur), grooved ( mélange de out et de in ), Double ( baah... un double quoi xD ), Ridge ( impression de cadre simple réaliste ). Puis au final vient la couleur du cadre souhaité !

Padding: chiffrepx
Ceci vous permet de laisser une marge entre votre phrase et le bord du cadre ce qui est bien plus appréciable lorsque l'on code quelques chose de long comme une présentation.

Margin: chiffrepx ou auto
Cela permet de crée une marge entre votre codage et la page... 20px placerais votre cadre a 20px du bord mais aussi du haut. Margin-left: permet d'ajouter une marge seulement à gauche... etc, et auto le place au centre.



Si jamais tu as un soucis, surtout n'hésite pas et poste ta question promis je ne mange pas !
Si tu préfère, je suis aussi joignable par MP si cela concerne un codage que tu prépare pour toi et ne souhaite donc pas le montrer à tout le monde Wink

_________________
avatar
GreenNazareth
Newbie
Newbie

Messages : 17
Date d'inscription : 03/01/2014
Age : 23

Voir le profil de l'utilisateur

Revenir en haut Aller en bas

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

 
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum