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>



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>.

Ailleurs sur la Bnbox

Ailleurs sur la Toile

Mini-tchat

?

Nimabbbhhhhhh proclame : Pamale Le 21 avril, 11h10 via Résumé - Le Médecin Malgrè ...

booba déclame : 7 Le 20 avril, 19h12 via Résumé : La Guerre de Troie...

lolilol écrit : Ca fait 7 Le 19 avril, 11h07 via Résumé du livre : Le Cid de...

sltje suis scribouille : Slt je suis nouvelle sur ce sit esque vous pouver medir si se cite eet bien Le 16 avril, 10h01 via Résumé - Le Médecin Malgrè ...

Latzo 109 écrit : Slt comme rooro l a dit c est pas le bn site mais moi aussi je joue a Fortnite mn compte c est PlayerSarro.
BYE
Le 15 avril, 22h23 via Résumé du livre : Le Cid de...

587564 griffonne : 3+4=7 Le 14 avril, 18h51

92000 scribouille : Trop facile Le 12 avril, 10h36 via Résumé - Le Médecin Malgrè ...

Okee25 bafouille : La réponse est 7 car 1+1+1(3)+1+1+1+1(4)=7.
C'est une logique mathématiques qui revient le plus souvent au classe de CP et GS.
Le 08 avril, 13h08 via Résumé scène par scène - Le...

milena bafouille : ùùmm Le 02 avril, 16h13 via Résumé - Les Fourberies De ...

sdefef" griffonne : Savazf Le 30 mars, 22h58 via Texte intégral - Le Médecin...

linabourhrou écrit : Bonjour Le 30 mars, 13h14 via Résumé - Les Fourberies De ...

Sora dit : Merci j'ai aussi un control tout à l'heure Le 26 mars, 8h09 via Résumé - Les Fourberies De ...

yoan déclare : Lol Le 25 mars, 21h01 via Résumé - Les Fourberies De ...

IKG murmure : GO Le 24 mars, 18h57 via Résumé : L'Avare

Canada griffonne : Qui aime la POUTINE Le 23 mars, 18h45 via Résumé scène par scène - Le...

Vladimir Poutine dit : Essaye Le 23 mars, 18h44 via Résumé scène par scène - Le...

Kim Jong Hun scribouille : Attention je vais envoyer un missile thermo-nucléaire Le 23 mars, 18h44 via Résumé scène par scène - Le...

Mac Gyver scribouille : Bon écoutez faut s'barrer d'ici donnez moi un trombone Le 23 mars, 18h41 via Résumé scène par scène - Le...

Don Diegue proclame : Je suis déshonoré Le 23 mars, 18h39 via Résumé scène par scène - Le...

Anonymous2.0 écrit : Wsh y a u bot Le 23 mars, 18h39 via Résumé scène par scène - Le...

bOTbUG dit : COPY/SITE/ROOM Le 23 mars, 18h38 via Résumé scène par scène - Le...

Yoo0Thy dit : Grace a se cite j ai remonter ma moyenne de 2 ptns franchement merci au createur de se cite merci beaucoup Le 18 mars, 14h32 via Résumé - Les Fourberies De ...

Bnmaster murmure : @Anonymous C'est un moyen simple de se prémunir contre les bots postant (au mieux) de la publicité. Le 16 mars, 12h56 via Résumé : Andromaque

Anonymous 2.0 chuchote : 3+4 est = à 7? Je ne comprend pas pourquoi ils ont mit ça.. Le 15 mars, 16h14 via Résumé - Le Médecin Malgrè ...

* dit : Que font les personnage les personnage dans cette scene 1 Le 13 mars, 17h58 via Résumé - Le Médecin Malgrè ...

* déclare : Rien Le 13 mars, 17h56 via Résumé - Le Médecin Malgrè ...

* griffonne : Je fait 555555 Le 13 mars, 17h55 via Résumé - Le Médecin Malgrè ...

marius déclame : Slt qui joue a last day on earth ? Le 12 mars, 19h57 via Résumé - La Chèvre De M. Se...

marius déclare : C trop bête Le 12 mars, 19h53 via Résumé - La Chèvre De M. Se...

marius s'exclame : Fastoche Le 12 mars, 19h44 via Résumé - La Chèvre De M. Se...

555555 gribouille : 3+4=7
sa va ?
Le 09 mars, 9h30 via Résumé - Les Fourberies De ...

louis s'exclame : Sklt Le 08 mars, 18h38 via Résumé scène par scène - Le...

louis klepak proclame : Salut les gars Le 08 mars, 18h38 via Résumé scène par scène - Le...

lol déclame : 3+4=7 Le 08 mars, 12h07 via Résumé - Les Fourberies De ...

rooro726bf s'exclame : Ca m'a aidé pour ma disertation Le 08 mars, 10h49 via Résumé du livre : Le Cid de...

rooro726bf déclare : Mais sinon très bien le résumé Le 08 mars, 10h49 via Résumé du livre : Le Cid de...

rooro726bf proclame : Ouais je sais que c'est pas le bon site mais si vous voulez jouer avec moi sur fortnite sur xbox one s mon pseudo c'est DemonZero61721 Le 08 mars, 10h44 via Résumé du livre : Le Cid de...

rooro726bf s'exclame : 7 Le 08 mars, 10h43 via Résumé du livre : Le Cid de...

rooro726bf griffonne : 7 Le 08 mars, 10h43 via Résumé du livre : Le Cid de...

nbh scribouille : 7 Le 07 mars, 19h53 via Résumé scène par scène - Le...

5OP s'exclame : 9RT788TY67 Le 07 mars, 17h20 via Résumé - La Chèvre De M. Se...

Mi écrit : Les gars vous me sauvez merci? Le 05 mars, 23h38 via Résumé scène par scène - Le...

Amisko chuchote : Ohh !!! Grace a vous uje sort de la gualere parceque je 'ai pas lu mon livre que je devait lire pour les petit vacance mtn !!OMG ce site est vraiment incroyab els!!! Le 04 mars, 19h20 via Résumé : L'Avare

Amisko écrit : Jadore !!! Oh.. Un père noel !!! Le 04 mars, 19h19 via Résumé : L'Avare

lili scribouille : J'aime beaucoup cette pièce, et elle est encore mieux quand on la joue tout les jours! Le 03 mars, 10h20 via Résumé - Le Médecin Malgrè ...

l gribouille : F Le 27 février, 21h11 via La Compagnie du Saint-Sacre...

Dionisio murmure : Merci Le 25 février, 17h42 via Résumé scène par scène - Le...

Bonjour bafouille : Cette pièce de théâtre est simplement NUL Le 23 février, 13h48 via Résumé : Le Mariage de Figa...

lolman dit : ZZzzZZZZZzzzzzZZzZzz Le 22 février, 17h24 via Résumé - Les Fourberies De ...

cgff bafouille : 22222222 Le 21 février, 19h02 via Résumé scène par scène - Le...

Publicité



Articles suivants

Articles précédents

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