MODELES GRAPHIQUES

Feuille de style modèle graphique N°9

 

Miniature du modèle

 

/* Feuille CSS réalisée par blueshit http://designdesk.org grace a quelques exelents tutorials :
http://www.elmoustikoblog.net/tutos/sources/structure_page/etape1.html
http://www.alsacreations.com/articles/modeles/g_fixe.htm
Feuille de style vadide W3C ! */

body {
margin : 10px 0;
padding : 0;
text-align : center;
font : 0.8em "Trebuchet MS", helvetica, sans-serif;
background : #fff url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/bg.png) repeat-x fixed 50% 0%;
}
div#conteneur {
width : 770px;
margin : 0 auto;
text-align : left;
background : #fff;
border : 1px solid #000;
}

h1#header {
height : 70px;
background : #000 url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/header.png) no-repeat 0% 0%;
width:770px;
margin : 0;
}

h1#header a{
position : relative;
left : 100px;
top: 15px;
font-size : 25px;
color : #000;
text-decoration : none;
}

h1#header img {
margin-left: 0;
margin-top: 0;
}

div#contenu {
padding : 0 180px 0 20px;
}

div#contenu h3 {
padding-left : 30px;
line-height : 30px;
font-size : 1.4em;
background : url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/h2.png) no-repeat 0% 100%;
color : #333;
border-bottom : 1px solid #333;
}

div#contenu h4 {
margin-left : 10px;
padding-left : 5px;
border-bottom : 1px solid #333;
border-left : 3px solid #333;
color : #333;
}

div#contenu p {
margin-left : 15px;
text-align : left;
line-height : 1.7em;
color : #333;
}

div#contenu table {
margin-left : 7px;
text-align : left;
line-height : 1.7em;
color : #333;
}

div#contenu a {
color : #333;
text-decoration : none;
background : #eee;
}

div#contenu a:hover {
color : #000;
background : #ddd;
text-decoration : none;
}

div#contenu h2 a , div#contenu h3 a {
color : #333;
background : #fff;
text-decoration : overline;
}

div#contenu h2 a:hover , div#contenu h3 a:hover {
color : #000;
background : #fff;
text-decoration : none;
}

pre {
overflow : auto;
}

#menu {
width : 770px;
}

ul#menu {
height : 30px;
margin : 0;
padding : 0;
background : url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/bg_menu.png) repeat-x 0 -20px;
list-style-type : none;
}

ul#menu li {
float : left;
text-align : center;
}

ul#menu li a {
padding : 0 10px;
line-height : 20px;
font-size : 0.7em;
font-weight : bold;
letter-spacing : 1px;
color : #000;
display : block;
text-decoration : none;
border-right : 1px solid #ccc;
}

ul#menu li a:hover {
color : #fff;
background : url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/bg_menu.png) repeat-x 0 0;
}

#vertical {
position: relative;
float: right;
right: 20px;
width: 140px;
text-align: right;
margin-bottom:10px;
}

div#vertical h2 {
padding-left : 30px;
line-height : 30px;
font-size : 1.4em;
background : url(http://heezee.blog4ever.s3.amazonaws.com/templates/9/h2.png) no-repeat 0% 100%;
color : #333;
border-bottom : 1px solid #333;
text-align: left;
}

div#vertical h3 {
margin-left : 10px;
padding-left : 5px;
border-bottom : 1px solid #333;
border-left : 3px solid #333;
color : #333;
text-align: left;
}

div#vertical p {
margin-right : 5px;
color : #333;
}

#vertical ul {
list-style-type: none;
margin: 0;
padding:0;
cursor: pointer;
}

#vertical li {
margin-left : 30px;
text-align: left;
}

#vertical li a {
line-height : 15px;
font-size : 1em;
font-weight : bold;
color : #333;
text-decoration : none;
}

#vertical li a:hover {
color : #000;
background: #eee;
}

div#footer {
margin : 0;
padding-right : 10px;
line-height : 30px;
text-align : right;
color : #333;
}

div#footer a {
color : #333;
background : #eee;
text-decoration : none;
}

div#footer a:hover {
color : #000;
background : #ddd;
text-decoration : none;
}

.spacer
{
clear:both;
}

 

 

...



30/01/2011
0 Poster un commentaire

A découvrir aussi


⨯

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 10 autres membres


Recommander ce blog | Contact | Signaler un contenu | Confidentialité | RSS | Espace de gestion