Cours 2

Utiliser du CSS dans un fichier HTML pour un environnement donné:
dans

<div style="background-color : blue;"> </div>

l'option "style" permet d'écrire du code CSS. Par exemple, pour essayer sans naviguer entre deux fichiers.

Ou dans l'environnement "head" au début du fichier html (cf n'importe quel exemple dont les liens sont donnés ci-dessous).

Utilisation courante du CSS

• Les bords
• Les marges attention, il y en a plusieurs types ! Voir ce schéma.
  • margins
  • padding
  Comme on ne voit pas les marges, c'est difficile de débuguer... Pour comprendre le problème, clic droit sur votre page, puis "examiner l'élément".
• Taille fixée et taille maximum
• Le texte
• Les liens et pour plus d'options, voir les buttons.
• Les listes
• Les bords arrondis
• Les ombres

Les environnements identifiés ou d'une classe.
Les classes si on veut que plusieurs environnement aient les mêmes propriétés (par exemple des sections, dont les titre sont de la même couleur).
L'attribut id s'il n'y a qu'un seul élément de ce type, avec des propriétés particulières.

Rq: comme l'environnement qu'on a identifié par "id" est unique, on peut faire une lien jusqu'à lui (en général si la page est longue ou si on vient d'une autre page).

La barre de navigation

La barre de navigation contient beaucoup de choses...

• les éléments d'une liste
• les liens dans les éléments de la liste

En général, on personnalise la couleur ou les bords. Voir le code source de : exple_nav_bar_personnalise.html

Attention, pour personnaliser une barre par défaut, il faut utiliser "id" sinon le navigateur va choisir le CSS par défaut et non le votre.

Options avancés (html)

Afficher un texte en appuyant sur un boutton (librairie Bootstrap)
Menu déroulant
Environnement encadré avec titre dans l'encadrement