aide gratuite page perso Accueil  | Internet | Informatique | Créer sa page persoGlossaireMenu | CSS
www.aidenet.com

 

CSS
Feuilles de style

Masquer et afficher des calques
sans javascript

Page - 70a3  www.aidenet.com

 

Cliquer ici pour voir exemple

exemple calques  Ce lien mène à un fichier ouvert dans une nouvelle fenêtre. La refermer pour revenir ici.

 

Code placé dans HEAD

 
a: hover
{ background : none ; } a div { display: none ; }

a: hover div {
display: inline ;
position: absolute ;
top: 270px ;
left: 200px ;
width: 200px ;
height: 100px ;
background: black ;
text-align: center ;
color: yellow ;
}

- display avec valeur inline = induit un élément à générer une ou plusieurs boîtes en-ligne

- position "absolute" avec 270px du sommet et 200px du bord gauche

- la boîte est dimensionnée à (largeur) width: 200px ; et (hauteur) height: 100px ;

- boîte avec fond en noir et texte justifié en jaune.

Un calque invisible qui se trouve défini par le lien "a hover" , apparaît lors du survol de ce dernier.

 

Sommaire applications ... @ ... Sommaire CSS

 

 aide gratuite

Tous droits réservés © 1997- 2005. www. aidenet.com

 

validateur HTML  validateur CSS