Accueil > Manip’s > CSS > 4- CSS : Déclaration d’une feuille de style externe
HTML, CSS, Pratique, Style
4- CSS : Déclaration d’une feuille de style externe
HEAD, LINK
dimanche 1er janvier 2006, par
- =>Déclaration d’une feuille de style externe
- Le conteneur de conteneur, introduction à la hiérarchie des objets
Internet n’a rien inventé
Il reproduit en virtuel des comportements séculaires,
Il y a le billet, le petit morceau de texte noirci de gauche à droite et de bas en haut, [1]
Et il y a le Tabloid réalisant une belle présentation, toute en cadres, en couleurs et en photos [2]
Le CSS est le langage qui assure la belle présentation d’une publication.
Tenter de réaliser une belle présentation "à l’ancienne" avec des Tableaux, revient à considérer le Tableur Excel comme une Alternative au traitement de texte Word.
Le 1er concept de la feuille de style est de rendre totalement indépendants
- le contenu [3]
- et sa présentation [4]
Le texte reste toujours le même
- Mais je peux créer un Style pour une présentation sur un Grand écran
- Un style pour une petite résolution
- Un avec des grandes polices pour les Mal-voyants
- Enfin un style dépouillé destiné uniquement à l’impression de la page, cadrant parfaitement avec le format standard de celle ci
Et bien sûr, laisser l’utilisateur accéder à chacune de ces présentations, comme bon lui semble.
Comment faire le lien entre une Page HTML et une Feuille de style CSS ?
- Une page WEB écrite en HTML (ou en PHP) d’un côté
- De l’autre une Page CSS regroupant tous les styles de présentation de la page précédente
Le lien enter le 2 se situe dans la Section
HEAD
de la page web, par l’entremise de la balise
LINK
Rappelons la structure le la page WEB MINIMALE
Et l’imbrication de ses balises structurelles
<html>
<head>
</head>
<body>
Bonjour
</body>
</html>
Une feuille se style nommée par exemple,
style_div.css
Se déclarera ainsi :
link rel="stylesheet" type="text/css" href="style_div.css"
Et se placera de cette façon dans l’entête de la page
<html>
<head>
<link rel="stylesheet" type="text/css" href="style_div.css">
</head>
<body>
Bonjour
</body>
</html>
