Cours sur les feuilles de styles CSS (Cascading style sheet)
Notions de boîtes
Les balises DIV / LAYER permettent de définir des « couches » contenant des éléments et pouvant être positionnées sur l’écran.
Il s’agit en réalité de balises HTML spéciales pouvant contenir elles-mêmes d’autres balises HTML, et dont les attributs sont entre-autres:
–La position par rapport au haut du navigateur,
–La position par rapport à la bordure gauche du navigateur,
–La largeur,
–La hauteur,
–Le Z-Index, c’est-à-dire le niveau de superposition de la balise
- La première (LAYER) est une balise spécifique à Netscape Navigator,
- Les balises DIV et SPAN sont plus génériques mais sont toutefois mieux supportées par Internet Explorer que Netscape Navigator
- La syntaxe de la balise LAYER est la suivante:
<LAYER NAME= »Nom de la couche » LEFT= »Distance au bord gauche » TOP= »Distance au haut »>
éléments HTML
</LAYER>
- Ainsi, le positionnement de deux images superposées sous Netscape Navigator (version 4 ou supérieure) peut se faire de la manière suivante
- Exemple:
<LAYER NAME= »IMG1″ LEFT= »20″ TOP= »30″>
<IMG SRC= »image.gif »>
</LAYER>
<LAYER NAME= »IMG2″ LEFT= »25″ TOP= »35″>
<IMG SRC= »image2.gif »>
</LAYER>
- Avec Internet Explorer (versions 4 et supérieures), le positionnement des éléments se fait selon le concept des CSS-2, au moyen des balises DIV et SPAN.
- Avec les balises DIV et SPAN, le positionnement peut se faire de deux façons:
–Le positionnement absolu se détermine par rapport au coin supérieur gauche de la fenêtre du navigateur. Les coordonnées d’un point s’expriment alors de haut en bas (top) et de gauche à droite (left).
–Le positionnement relatif se fait par rapport à d’autres éléments, comme une image, c’est-à-dire que les éléments contenus dans la balises DIV ou SPAN seront positionnés à la suite des éléments HTML après lesquels ils se trouvent.
- La syntaxe des balises DIV/SPAN est la suivante:
<DIV style= »position: absolute; top: 99 px;
left: 99 px; visibility : visible;z-index : 2; »>
éléments HTML
</DIV>
Les feuilles de styles CSS (Cascading style sheet) (1,75 MO) (Cours PPT)