Chapitre 1
Les balises html de base
Créer des titres, créer des paragraphes
Le langage HTML définit 6 niveaux de titres (en anglais heading), afin de définir une structuration hiérarchique des paragraphes dans un texte :
<h1> → Titre du document, ne s'emploie qu'une seule fois dans chaque page par convention
<h2> → Grand titre
<h3> → Premier sous titre
<h4> → Deuxième sous titre
<h5> → Troisième sous titre
<h6> → Quatrième sous titre
Il ne faut pas confondre les titres dits "en-tête 1" pour h1, "en-tête 2" pour h2, "en-tête 3" pour h3, etc. avec la balise <title> que l'on place dans le head pour indiquer le nom du document dans le navigateur. Les titres ou en tête précisent les titres dans la page visible.
Les paragraphes
Les paragraphes se rédigent entre les balises <p> et </p>. Cela crée un grand retour chariot.
Pour les retours à la lignes avec un interlignage moins grand, on emploie la balise <br/>,cette balise est particulière car elle ne fonctionne pas par paire, le slash est d'ailleurs placé après br.
Je vais tout de suite parler de l'espace insécable : il s'agit d'une espace entre deux mots qui ne seront pas séparés par un éventuel retour à la ligne. Sa représentation en html est .
La ligne de séparation horizontale
Enfin voici une dernière balise : la ligne horizontale que l'on écrit <hr>. Tout comme la balise br, elle ne fonctionne pas par paire et le slash se place après le hr.
Les citations
La balise <q> est adaptée aux citations courtes.
La balise <cite> affiche son contenu avec un style spécifique qui varie suivant les navigateurs. Cette balise n'entraine pas de saut de ligne (ni avant ni après), elle est utilisée pour des citations moyennes ou des références alors que le tag BLOCKQUOTE est adapté à des citations longues.
La balise <blockquote> permet de mettre en valeur un paragraphe, il est adapté aux citations longues. Suivant les navigateurs, on observe différents effets : un décalage par rapport à la marge courante du document, un retour à la ligne précédent et suivant le bloc de texte ou autres styles (italique ...).
Avec la balise blockquote, nous pouvons créer des bulles de dislogues avec des styles avancés, comme le propose Nicolas Gallagher : http://nicolasgallagher.com/pure-css-speech-bubbles/demo/
Mise en forme avec le html
Indice et exposant
<sub> est employée pour la mise en indice, comme pour l'élément H2O
<sup> est employée pour la mise en exposant, comme pour la 1re exposition.
Écriture en gras
Pour écrire en gras, on emploie la balise<b> ouvrante/fermante.
<strong> est employée pour la mise en valeur forte, le texte est en gras par défaut, on peut le styliser dans les css.
Écriture en italique
Pour écrire en italique, on emploie la balise <i>.
<em> est employée pour la mise en valeur faible, le texte est en italique par défaut, on peut le styliser dans les css.
Autres balises
<pre> à l'intérieur de cette balise, le texte s'affiche tel qu'il a été tapé dans le code.
<script>
function creerFenImage() {
fiRef = window.open("","fenImage","width=600,height=397,scrollbars=no,
toolbar=no, location=no, directories=no, status=no")
}
</script>
<del> indique que le texte a été supprimé, le texte apparaît barré.