Récapitulation
1.Mise en page.
On à généralement intérêt à prévoir une certaine
unité de présentation dans un ensemble de pages, (site ou partie d'un site).
Ceci est particuliérement vrai pour tout les éléments servant à naviguer ou
à se repérer dans le site, il est important qu'on puisse les identifier au
premier coup d'oeil. La possibilité de fixer le style d'un ensemble de pages à
travers un fichier de style, (extension css), permet de s'assurrer d'une telle
uniformité et aussi de modifier facilement un ensemble, sans risque d'oubli.
Il est donc important de distinguer dans les pages, ce qui
est spécifique a ces pages et ce qui est commun au site ou à un groupe de
pages. Il est bon de réfléchir à ceci avant de démarrer l'écriture des
pages mais en tout état de cause il vaut mieux prévoir d'emblée une
instruction de Link a un fichier Css, ce qui permettra d'introduire des
styles communs à l'ensemble du site. Ce fichier peut-être vide au départ de
la réalisation du site, on le complétera au fur et à mesure des évolutions
de la conception.
On peut toujours modifier localement l'aspect d'une page ou
d'un paragraphe.
2.Réalisation d'une page.
Cette page se composera de :
Un titre Nom de la Class clsTitre,
Fontes Times
New Roman, Arial, Verdana
Taille 36pt
Italique
Gras
Indentation
25%
Un paragraphe de texte Nom de la
Class clsParag
Taille 18 pt
Indentation
20%
Dans ce paragraphe le mot forme
est surligné Nom de la Class Surlignage
Couleur de
fond aqua
Couleur de
texte navy
Une note de bas de page, fond jaune
Nom de la Class Note
Couleur de
fond yellow
Taille 17 pt
Italique
Couleur de
texte navy
Conditions de défaut de la page
Fonte Arial
Taille 15 pt
Couleur du
texte black
Dans la forme ci dessous, vous trouverez le squelette de
la page, avec les textes, vous devez écrire les styles à l'intérieur des tags
<Style>, veillez bien à employer les mêmes nom de class que dans les
tags <div>.
Corrigé
Commentaires sur le code précédent :
Dans le premier paragraphe, on trouve
<p>Titre</p>, le saut généré par le tag <p> dépend de la
taille dans la class clsTitre.
Dans le span de surlignage, vous
trouvez le code qui génére un espace, ce code permet d'outrepasser
l'automatisme du html qui remplace deux espaces consécutifs par un seul.
2.Deuxième partie.
Les différentes commandes Css que
nous avons vu jusqu'à présent peuvent-être appliquées sans nécessiter
l'écriture de script, ( programmation),
ce n'est pas vraiment le cas des commandes de positionnement et de
visibilité que nous verrons en deuxième partie. Pourquoi alors voir ces
commandes sans l'accompagnement de scripts et ne pas attendre le cours de
javascript?
Il est important de connaître ces commandes en tant que
commandes Css, la syntaxe est différente quand on les emploient dans un script.
Par exemple, quand on programme un bouton pour afficher quelque chose, (disons
une image), il est important d'être sure que cette image est chargée avant de
lancer l'opération. Le bouton sera chargé en mode caché donc invisible et
nous le ferons apparaître quand l'image concernée sera elle aussi chargée.
Dans ce cas la syntaxe d'écriture du style sera celle des commandes Css et non
celle du script.
D'autre part, il n'est pas forcément nécessaire d'être un
expert en javascript pour utiliser des scripts, en effet il existe des
bibliothéques de programmes dont l'usage est "assez simple".
J'introduirai une présentation de cette forme d'écriture de page en fin de ce
tutorial.
![]() |
Sommaire | ![]() |
Précédent | ![]() |
Suivant |