HTML5 - CSS3 - coins arrondis...- ForImage... | Conseil | Formation

- Conseil - Formation - Création -

Nous contacter

Crédits

0 975 439 722
06 64 51 42 91
N'hésitez-pas à laisser
un message. Je vous rappelerai...

Des exemples de CSS3 au service du graphisme...

Les coins arrondis... Ne fonctionne pas sur IE6, IE7, IE8...

Avec une balise div...

La régle CSS

.coins {
background-color: #900;
margin: 5px;
height: 100px;
width: 200px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}

Et un menu...

Et les régles CSS...

#navigation1 {
list-style-type:none;
margin-top: 0;
margin-right: 0;
margin-bottom: 0;
margin-left: 20px;
}
#navigation1 li {
float:left;
margin-left: 2px;
}
#navigation1 li a {
display:block;
background-color: #990000;
color:#fff;
font-size:12px;
text-decoration:none;
border: 1px solid #FFF;
padding-top: 5px;
padding-right: 10px;
padding-bottom: 5px;
padding-left: 10px;
}
#navigation1 li a:hover {
background-color: #B52F33;
color:#000
;
}

Et un menu avec bords arrondis, aux exterieurs... Ne fonctionne pas sur IE6, IE7, IE8...

Et les régles CSS... Juste la détection du premier et dernier élément de la liste..

#navigation2 li:first-of-type a {
border-radius: 10px 0px 0px 10px;
}
#navigation2 li:last-of-type a {
border-radius: 0px 10px 10px 0px;
}

- Création - Gestion de la Couleur et Profils ICC - Formations - Utile... - Réalisations - Téléchargements -