Et la face des eaux, et le front des montagnes, Ridés et non vieillis, et les bois toujours verts S'iront rajeunissant ; le fleuve des campagnes Prendra sans cesse aux monts le flot qu'il donne aux mers. Mais moi, sous chaque jour courbant plus bas ma tête, Je passe, et, refroidi sous ce soleil joyeux, Je m'en irai bientôt, au milieu de la fête, Sans que rien manque au monde, immense et radieux !
Le soleil s'est couché ce soir dans les nuées. Demain viendra l'orage, et le soir, et la nuit ; Puis l'aube, et ses clartés de vapeurs obstruées ; Puis les nuits, puis les jours, pas du temps qui s'enfuit ! Tous ces jours passeront; ils passeront en foule Sur la face des mers, sur la face des monts, Sur les fleuves d'argent, sur les forêts où roule Comme un hymne confus des morts que nous aimons.
La propriété Z-INDEX permet de positionner un élément HTML dans la pile d'affichage. Dans cet exemple, quatre éléments sont disposés dans l'arbre du document dans un ordre précis, dont trois ont une position absolue. Ces trois derniers placés exactement à un endroit déterminé de la page, en l'occurrence à 200 pixels du haut de la fenêtre, se chevauchent. A l'aide de la propriété précitée, un ordre a été déterminé, disposant l'image sous les deux textes dont le blanc se retrouve au-dessus de la pile d'affichage et le pourpre juste en-dessous.
... <style> .pile { position: absolute; top: 200px; width: 350px; height: 230px;} </style> ... <img src="./Couchesoleil.jpg" border="0" alt="Un magnifique couché de soleil" style="z-index: 1" id="image" class="pile"> <div id="text1" class="pile" style="z-index: 3"> <pre style="color: white; font-size: 18pt"> ... </pre> </div> <div id="text2"> <pre style="font-size: 18pt"> ... </pre> </div> <div id="text3" class="pile" style="z-index: 2; color: purple; font-size: 20pt"> ... </div> ... |