Dépannage informatique à domicile NCT Micro
  Cliquez ici pour vous abonner à ce flux RSS  

Ce code affiche un menu avec puce et un autre sans puce et le troisième de couleur verte, la classe "menunonevert a" héritant de"ul#menunonevert".

Exemple de menu vertical:




Codage CSS de l'exemple:

/* Menu avec des puces */
ul#menu {
margin: 0;
padding: 0;
font: bold 1em Geargia, Times serif;

}

/* Menu avec des puces */
ul#menunone {
margin: 0;
padding: 0;
font: bold 1em Geargia, Times serif;
list-style-type: none;

}

/* Menu sans puces */
ul#menunonevert {
margin: 0;
padding: 0;
font: bold 1em Geargia, Times serif;
list-style-type: none;

}

/* Menu vert hérité de ul#menunonevert */
#menunonevert a {
color: green;
text-decoration: none;

}

Code HTML pour afficher le style CSS

<html>
< head>
< style type="text/css"> @import url(style/style.css);</style>
< /head>
< body>
<ul id="menu">
< li><a href="#">Lien 1</a></li>
< li><a href="#">Lien 2</a></li>
< li><a href="#">Lien 3</a></li>
< li><a href="#">Lien 4</a></li>
< /ul>
< br/>
< ul id="menunone">
< li><a href="#">Lien 1</a></li>
< li><a href="#">Lien 2</a></li>
< li><a href="#">Lien 3</a></li>
< li><a href="#">Lien 4</a></li>
< /ul>
< br/>
< ul id="menunonevert">
< li><a href="#">Lien 1</a></li>
< li><a href="#">Lien 2</a></li>
< li><a href="#">Lien 3</a></li>
< li><a href="#">Lien 4</a></li>
< /ul>
< /body>
< /html>