HTML
Le langage HTML est à la base de TOUTES les pages web que vous visitez, même les sites en FLASH. Ce langage est constitué de balises qui organise le texte ou l'informations (Images, vidéos, etc...). Un document HTML typique se constitue de la façon suivante :
<html>
<head>
<title>Le titre de votre page</title>
</head>
<body>
Contenu de votre page web...
</body>
</html>
La compréhension de la structure d'un document HTML n'est pas très importante lorsqu'on ne créé pas une page en totalité. Le plus important à retenir est que le langage HTML se compose de balises (ex:<body></body>) et que celles-ci doivent être refermées (ex:<div>Bonjour) (ex:<div>Bonjour</div>). Vous aurez compris que la balise de fermeture comprend un «/». Ces balises ne sont bien entendue pas visibles par l'utilisateur final qui consulte la page avec un navigateur comme Firefox.
Balises HTML utiles pour les pages MySpace:
<a href="http://www.ecoutez.ca">exemple de texte</a> : créé un lien vers http://www.ecoutez.ca avec le texte «exemple de texte»
<img src="http://www.ecoutez.ca/image.jpg" /> : affiche l'image http://www.ecoutez.ca/image.jpg (cette balise n'a pas besoin d'une balise de fermeture mais demande un «/» avant la fin.
<p>exemple de texte</p> : délimite un paragraphe
<div>exemple de texte</div> : délimite une boîte de texte (avec changement de ligne après)
<span>exemple de texte</span> : délimite une boîte de texte (sans changement de ligne)
La différence entre une balise <span></span> et <div></div> est le changement de ligne après la balise. Si vous voulez isoler un mot dans une phrase vous devez utiliser la balise <span></span> car elle ne brisera pas votre phrase avec un changement de ligne.
<span>Bonjour,</span> ce blog ...
Affiche :
Bonjour, ce blog ...
<div>Bonjour,</div> ce blog ...
Affiche :
Maintenant que vous connaissez les principales balises HTML, il est temps de leur trouver une utilité!
CSS
Le CSS est un langage ajouté au HTML qui permet de définir le style de votre page. Vous pouvez ajouter à toutes vos balises HTML un paramètre style="" contenant les informations de mise en forme (ex:<div style="font-weight:bold;">Bonjour</div> affiche le texte contenu dans la balise <div></div> en gras)
Voici les principaux paramètres CSS:
Détails | Valeurs |
font-size | Définir la taille du texte Valeurs possibles: <chiffre> px ex: font-size:14px; |
font-weight | Définir l'épaisseur du texte Valeurs possibles: normal bold ex: font-weight:bold; |
color | Définir la couleur du texte Valeurs possibles: #<valeur hexadécimale> <nom de la couleur> ex: color:#ffffff; ex: color:red; |
background | Définir l'arrière-plan Valeurs possibles: #<valeur hexadécimale> <nom de la couleur> url(<adresse de l'image>) no-repeat ex: background:#ffffff; ex: background:red; ex: background:url(http://www.ecoutez.ca/image.jpg) no-repeat; |
Je vais ajouter peu à peu d'autres paramètres CSS et d'autres balises HTML.