La Bnbox !

Créateur de sourires...

Mon compte

S'inscrire

Recherche

Vous êtes ici : Accueil » Atelier Webmaster » Cours HTML » Chapitre 3

Atelier Webmaster



< Cours précédent - Sommaire du cours - Cours suivant >

Cours HTML : Chapitre 3


Traitrement de la page


Voilà un tout petit chapitre qui va nous permettre d'appronfondir les bases qu'on vient d'apprendre et d'embellir encore la pseudo- page de notre exemple... On vient de voir qu'on pouvait ajouter des "options" dans la partie ouvrante d'une balise et dans beaucoup de cas c'est possible et cela nous sera grandement utile !

Réfléchissons un peu. Pour dire à tel phrase d'être de tel couleur on a rajouté "l'option": <font color=\"tel couleur\">. Et à votre avis, où est ce qu'on va rajouter une option pour changer la couleur de la page...?
Dans <body> !
Il suffit de rajouter bgcolor=\"#xxxxxx\" (=<b>b</b>ack<b>g</b>round<b>color</b>. Soit en français couleur du fond.) dans <body></body>. Allez un petit exemple pour bien intégrer tout ça.
Code :
<html>
  <head>
    <title>Une page toute en couleur!</title>
  </head>
  <body bgcolor="#118855">

<font size="5" color="purple" face="Comic Sans Ms"><p align="center">
<b>Bienvenue sur mon site!</b>
</font></P>

<hr width="80%" size="3" color="red" align="center">

<font color="blue">
<blockquote>
Maintenant que je sais mettre une couleur sur le fond, je vais pouvoir y ajouter une image, changer la couleur des liens, que sais-je encore?
<font>
<blockquote>

</body>
</html>

Tester la page


Et voilà votre page est en couleur ! Il vous suffit juste de changer le "nom" de la couleur pour chanegr encore la couleur de la page! Faites un test en mettant "black" à la place de "#118855". Puis remplacez "black" par "#cc9933" pour vous entrainer!

Je vais vous faire un petit topo de ce qu'on peut mettre dans <body>, vous verrez qui a vraiment pleins, pleins de choses et tout n'y est pas ici... (par exemple quand on met certains scripts java il faut rajouter quelque chose dans je vous expliquerez ça vers la fin du cours...)
  • bgcolor=\"#xxxxxx\" : Pour changer la couleur du fond. Un fond en couleur c'est vraiment plus jolie que tout blanc... Reportez vous au chapitre 2 la partie sur les couleurs si vous ne vous souvenez plus bien comment ça marche !
  • background=\"\" : Pour mettre une image de fond. Il suffit de mettre le nom de l'image et sa terminaison entre les deux "". (par exemple si c'est une image gif qui s'appelle poisson, on mettra: poisson.gif) Les images on verra ça un peu plus loin, je sais que c'est ce que vous attendez le plus, mais ne vous inquiètez pas on y arrive rapidement. Si vous voulez vous amuser en attendant, mettez l'image en question dans le même dossier que le fichier .html.
  • bgproperties=\"fixed\" : Quand on fait descendre la page, l'image du fond reste figé! Cela rend bien dans certains cas. Quand on ne le met pas, l'image descend avec la page.
  • text=\"#xxxxxx\" : Gràce à "text", vous changez la couleur de tout votre texte. (vous changez les #xxxxxx par des carractères héxadécimaux.) Au lieu que la couleur par défaut sois noir, ce sera la couleur que vous avez mis dans "text". Et vous pourrez toujours utiliser <font> pour mettre une couleur spécial à certaines parties de votre texte.
  • link=\"#xxxxxx\" : Ce sera la couleur de vos liens! (pour cela il vous suffit de mettre une couleur à la place des xxxxxx, enfin vous avez l'habitude maintenant...) Oui, vous pouvez changer la couleur de vos liens... Ah mais on n'a pas encore vu comment faire des liens, bête ça bn_tongue ça arrive, ne vous inquiètez pas ^-^
  • vlink=\"#800080\" : Et ça, c'est la couleur de vos liens quand vous cliquez dessus.
  • alink=\"#ff0000\" : Si on a cliquez sur vos liens alors ils deviendront de cette couleur. Cela veut dire qu'ils été "utilisé". Cela correspond au violet sur les liens par défaut.
  • class=\"blabla\" : C'est une particule pour le CSS ! On le verra tout à la fin du cours ! Ne vous inquiètez pas si je vous parle de beaucoup de choses que l'on fera plus tard cela vous met l'eau à la bouche et ça vous permet de vous y connaitre un peu plus en HTML!
  • leftmargin=\"11\" : Vous mettez n'importe quel chiffre à la place du "11". L'unité est le point, c'est une unité spécial plus petite que le pixel. En fait vous déterminer à quel distance votre texte, vos images, enfin votre page va être du bord gauche...
  • rightmargin=\"11\" : La marge de droite de votre page. Ce que vous déterminez c'est comme une marge sur word.
  • topmargin=\"19\" : la marge du haut. Ici il y aura 19pixels entre le bord haut de la page et le début de votre texte, image etc...
  • marginwidth=\"11\" : ça c'est la largeur de votre marge.
  • marginheight=\"19\" : La hauteur de la marge de votre page.


Quand vous mettez un background, n'hésitez pas à mettre aussi une couleur de fond, comme ça le temps que l'image arrive, il y a de la couleur !


Ça fait pas mal de choses tout ça! Vous utiliserais souvent bgcolor et background, les autres aussi, mais plus rarement...

Comme souvent en HTML, il n'y a pas qu'une seul méthode pour faire une chose... Et pour changer la couleur du texte il existe une autre méthode. En fait, pour cette autre méthode on utilise plus le HTML, mais le CSS, c'est un autre style de language très très proche du HTML. On en reparlera vers la fin des cours! Pour l'instant on reste sur le HTML !


C'était petit comme chapitre, n'est ce pas? Je n'ai pas voulu le mélanger avec celui du "traitement du texte" car j'avais peur que cela vous embrouille. Je pense que c'est mieux ainsi car vous avez le temps de souffler entres les chapitres.
De plus, à partir de maintenant vous pouvez commencer à faire des tests tout seul! Créer des pages, vous en êtes capables ! Bien sûr ce ne sera pas très élaboré, mais cela vous entrainera! Un petit exemple ? Une page avec comme fond votre tête qui ne suit pas la page quand on descend. Il faut une couleur adéquate pour qu'on arrive à bien lire le texte (photo adéquate aussi !) et comme sujet, le projet d'un site que vous aimeriez faire ! (si vous la trouvez magnifique vous pouvez la mettre sur le forum )

L'heure du bilan


  • Mettre une couleur de fond.
  • Les différentes options de <body>.
Remonter < Cours précédent - Sommaire du cours - Cours suivant >

Top articles Bnbox

Ailleurs sur la Bnbox

Ailleurs sur la Toile

Mini-tchat

?

saloperie Biatcherie

 Hier, 18h51 via Résumé : Andromaque

sansan-62540 E

 Hier, 18h02 via Résumé : La Promesse de l'a...

sansan-62540 ça va bebe

Le 06 février, 21h18 via Résumé - La Chèvre De M. Se...

mimi Sa me prend la tete qq1 pourrait-il m'aider a propos des principaux personnages de Bel-ami Le 06 février, 18h47 via Fiches sur les personnages ...

mimi Pourquoi cette question ? Le 06 février, 18h45 via Fiches sur les personnages ...

dep Salut qqun est la ? Le 05 février, 17h16 via Résumé : Le Tartuffe de Mol...

MAXIME BONJOUR A TOUT

 Le 04 février, 8h52 via Résumé : L'Avare

MAXIME Sa va mon ami Le 04 février, 8h51 via Résumé : L'Avare

Vous êtes en quelle classe? Le 03 février, 22h35 via Résumé : L'Avare

ange0610 Juste de croire sa

 Le 03 février, 17h25 via Résumé : L'Avare

ange0610 C pa Le 03 février, 17h25 via Résumé : L'Avare

louloutte Il faut que vous faite vous résumé seul car on ne peut compter que sur soi même, en sachant que la plupart des personnes qui copie sont stupide je demanderai donc a chaque élève intelligent, de faire ses résumé soi-même sinon considéré vous comme STUPIDE! Le 02 février, 11h26 via Résumé : Andromaque

lilou A ete voir tartuffe à la rochelle Le 02 février, 10h44 via Résumé : Le Tartuffe de Mol...

headofcock Faut bosser plus OOOOO!!! Le 01 février, 22h45 via ROC : Théorème des Gendarm...

df9iv Apprende le code morse avec l`Android-app: MorseMind

Gerd, DF9iV Le 01 février, 18h45 via Apprendre le Morse

Bnmaster Et désolé pour la coupure de la semaine dernière ! (panne serveur + petite erreur de ma part bn_wink) Le 01 février, 13h52 via Résumé : Andromaque

Bnmaster @xMERVEiiLx Si tu fais des résumés d'oeuvres qui ne sont pas sur la Bnbox, n'hésite pas à me les envoyer ! D'autres te remercieront mini_bn Le 01 février, 10h21 via Accueil

xMERVEiiLx Et Puis Ceux Qui Se Plaignent Vous n'avez qu'as Vous Inspirer De Ce Site Et D'autre Sites bn_wink Le 26 janvier, 17h17 via Résumé : L'Avare

xMERVEiiLx bn_big_smile

 Le 26 janvier, 17h15 via Résumé : L'Avare

xMERVEiiLx Moi j'ai une prof" spéciale et elle nous fait écrire chaque jour le résumé de la scène lu... Mais on sait pas si elle va noter puiqu'elle nous dit toujour qu'elle va noter puis non, Alors au cas ou je résume toutes les scènes... (Enfin pas moi le site) bn_heureux" Le 26 janvier, 17h14 via Résumé : L'Avare

Bnmaster bn_wink Le 26 janvier, 16h35 via Accueil

DarKnight Haha ! Le 26 janvier, 0h35 via Accueil

kamigas Bjr Le 25 janvier, 19h54 via Résumé : Andromaque

Patate J'aime pas la promesse de l'aube. et je dois écrire un avis argumenté dessus. Génial.

J'aime les patates. Le 25 janvier, 18h06 via Romain Gary : La Promesse d...

password.txt Azer Le 25 janvier, 12h13 via La sémantique du XHTML

Amelie2110 J'ai lu il y a longtemp La Promesse de l'aube de romain gary et je doit écrire un avis argumenté pour après demain.

Comme je n'ai pas envie de relire le livre, je voulais demander si quelqu'un pourrait me donner une description présise des personnages.

Merci

Le 24 janvier, 22h35 via Accueil

Amelie2110 Salut!

Le 24 janvier, 22h32 via Accueil

nj] Cc

 Le 23 janvier, 14h27 via Résumé - Les Fourberies De ...

koukou C est mieux que rien alors allez lire le livre fermer la

Le 23 janvier, 14h08 via Résumé : L'Avare

koukou Ha haaha

 Le 23 janvier, 14h07 via Résumé : L'Avare

The_anti_avare Je suis déçu bn_heureux

 Le 23 janvier, 13h09 via Résumé : L'Avare

The_anti_avare Un peu trop cour ma prof va s'en rendre compte et ca ne m'aide pas plus à cocmprendre le livre -.-

 Le 23 janvier, 13h06 via Résumé : L'Avare

jada Pour le cid le résumé est réussi! Le 22 janvier, 22h59 via Résumé scène par scène - Le...

G Yeah Le 22 janvier, 17h05 via Activités manuelles

Fraaxy Vs êtes tous nuls c'est génial l'avare !!!! Le 22 janvier, 16h06 via Fiches sur les personnages ...

Le_chinois_du_13 Chuis obligé de le lire

 Le 22 janvier, 15h46 via Résumé : L'Avare

Le_chinois_du_13 Sert a rien

 Le 22 janvier, 15h46 via Résumé : L'Avare

Le_chinois_du_13 NUL Le 22 janvier, 15h46 via Résumé : L'Avare

Le_chinois_du_13 Pourri

 Le 22 janvier, 15h46 via Résumé : L'Avare

Le_chinois_du_13 C'est Bidon

 Le 22 janvier, 15h45 via Résumé : L'Avare

Le_chinois_du_13 Celui qui a compris ce livre est un génie

 Le 22 janvier, 15h21 via Résumé : L'Avare

toto Ce livre est nul Le 22 janvier, 15h18 via Résumé : L'Avare

toto

nul Le 22 janvier, 15h18 via Résumé : L'Avare

quebachéri Prkoi ne pas ecrire des resumés directement je comprendrais plus vite l'histoire !! lol

 Le 21 janvier, 16h56 via Résumé : L'Avare

lolilol Je n'ai rien compris a ce livre jai 13 ans

 Le 21 janvier, 13h19 via Résumé : L'Avare

lili L'avare de moliere est une piece bien et comique!!!!!!!!

 Le 20 janvier, 19h31 via Résumé : L'Avare

bg Hello Le 20 janvier, 14h44 via Résumé : Le Tartuffe de Mol...

agaga Oh des bananes

*

*

*

langage sms interdit :@

 Le 19 janvier, 21h35 via Résumé - Le Médecin Malgrè ...

bernard 3+4=7 Le 19 janvier, 14h04 via Fiches sur les personnages ...

khgdtrsdhgvulkytg Toto Le 19 janvier, 14h03 via Fiches sur les personnages ...

Publicité



Articles suivants

Articles précédents

©Bnbox (Infos) - Cahier de l'élèves - Atelier webmaster - Boîte à Nuts - Bar à Nougat - Valide XHTML 1.0, CSS 2, RSS 2.0
Flux RSS