Méthode interne = (embedding)
Il s'agit de placer les règles du langage CSS entre <HEAD> et </HEAD> dans la ou chaque page souhaitée. Comparez ci-dessous avec un premier exemple réalisé en HTML pur appliqué au tag "h2" placé dans le BODY et qui donne ...
Résultat exemple 1 HTML
Titre 2, exemple HTML
Résultat exemple 2 CSS
Titre 2, exemple CSS
............ le sélecteur "h6" (par exemple pour les besoins de la démonstration ) codifié avec un corps de 16 points.
Code source dans HEAD
<STYLE type="text/css">
h6 { font-family: arial, verdana, sans-serif
; font-size: 18pt ; color: black ; background-color: #FFFFFF ; }
</STYLE>
en bleu et obligatoire le type de style CSS utilisé et en rouge le sélecteur servant pour cet exemple. Cette règle est en place dans le source de ce fichier, sinon la démo ne fonctionnerait pas.
Vous trouvez souvent la présentation suivante "aérée" qui est plus lisible.
<STYLE type="text/css">
h6
{
font family: arial, verdana, sans-serif;
font-size: 18pt;
background-color: #ffffff;
}
</STYLE>
Par contre, il y a dans cet exemple la valeur de h6 = 16 pt, choisie volontairement pour faire le distinguo entre le CSS et le HTML. En effet " h2 " est mentionné dans l'exemple code HTML pur, et le reprendre dans le bloc CSS ne pourrait fonctionner (souvenez-vous que le CSS est prioritaire sur le HTML).
"h6" en HTML pur dans un source normal aurait
donné ceci :
"Titre 2, exemple"
Vous pouvez ainsi commencer à réaliser des exercices de base du CSS mais n'oubliez jamais de fermer les sélecteurs (<h6> --- </h6>, (même pour certains comme <p> pas obligatoire en HTML).
Sommaire CSS... @ ... Méthode externe = (Linking)