-
Thème 2 - You're space, right?
Voici mon deuxième thème en full css! Vous n'avez qu'à copier/coller les codes dans les parties indiquées et c'est magique!
Si jamais vous ne savez pas comment trouver le numéro de vos menus, dites le moi, je vous aiderait. Sivous ne souhaitez que l'un ou l'autre des menus de lien, vous pouvez supprimer le code qui ne vous sert pas. (j'ai mis des indications dans le css si jamais)
Le blog test se trouve ici, si vous voulez voir l'intégralité du thème (les commentaires, les forums, le reste de la page...).
Merci de me prévenir si vous l'utilisez. ♥
(+) il faut que toutes les valeurs soit à zéro et décochées, sauf format du blog > page > automatique centré
(+) L'image, le titre du blog et les liens doivent être dans le même menu.
(+) Vous pouvez changer les couleurs si elles ne vous plaisent pas. Si vous avez besoin d'aide, n'hésitez pas! (je peux modifier une image pour vous, si vous voulez qu'elle s'accorde à peu près avec le thème)
(+) Les "XXXXXXXX" module_menu_contenuXXXXXXXX sont à remplacer par le "numéro" de votre module. Voici un tuto qui pourrait vous aider ici! Et si jamais, je suis joignable pour toute question.
CODE CSS:
/*----------------BODY & FENÊTRE----------------*/
#body {
background:transparent url("http://ekladata.com/O7lG9Ob_KkVv9pTZZBaATKBB1Is/fond1.png")center top repeat-y;
background-color: #C1C1C1;
font-family: tahoma;
font-size: 11px;
}
#body a {
text-decoration: none;
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
}
body a:hover {
-webkit-transition: all 0.4s ease;
-moz-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
}
.module_contenu img {text-align: center;
margin 0px;
}
/*----------------FOND PAGE----------------*/
#background {
width: 860px;
}
/*----------------HEADER----------------*/
#header{
height: 15px;
}
/*----------------MENU----------------*/
/****MENU 1*****/
#menu1 {
position: fixed;
top: 37px;
margin-left: 20px;
width: 167px;
text-align: center;
color: #808080;
}
#menu1 a{
color: #58853D;
}
#menu1 a:hover{
color: #8EB4C9;
}
/*menu 1*/
#module_menu_contenuXXXXXXXX p{
background-color: #889D92;
color: white;
margin-top: 5px;
text-transform: lowercase;
letter-spacing: 1px;
}
#module_menu_contenuXXXXXXXX a{
display: block;
color: white;
background-color: #6A91B0;
width: 100%;
padding: 10px 0px 10px 0px;
margin: 5px 0px 2px 0px;
font-size: 9px;
text-transform: uppercase;
font-family: tahoma;
letter-spacing: 2px;
}
#module_menu_contenuXXXXXXXX a:hover{
color: white;
background-color: #E3836C;
}
/***DERNIERS VISISTEURS***/
.module_menu_type_lastvisitors .module_menu_titre {
font-size: 0px;
height: 0px;
margin-top: 20px;
}
.module_menu_type_lastvisitors img {max-width: 35px;
border: 2px solid lightgrey; margin-bottom: 3px;
border-radius: 80px; margin: 5px;
}
.module_menu_type_lastvisitors img:hover {opacity: 0.8;}
/*----------------ARTICLES----------------*/
.module_titre_contenu{
height: 100%;
background-color: #889D92;
border: 4px solid white;
outline: 1px solid #CECECE;
color: white;
text-align: center;
padding: 10px;
font-family: arial;
font-size: 15px;
letter-spacing: 2px;
word-spacing: 2px;
text-transform: lowercase;
font-style: italic;
margin-left: 104px;
margin-right: 87px;
}
.module_titre_contenu a{
color: white;
font-style: italic;
}
.module_titre_contenu a:hover{
opacity: 0.7;
}
.article_info {
font-size: 0px;
text-align: right;
font-style: italic;
color: #A1A1A1;
margin-bottom: 10px;
}
.article-info a{
font-weight: bold;
}
.module_contenu {
color: #555555;
text-align: justify;
font-family: tahoma;
font-size: 12px;
padding: 15px;
margin-bottom: 50px;
margin-left: 94px;
margin-right: 78px;
}
.module_contenu a {
color: #E48069;
font-weight: bold;
}
.module_contenu a:hover {
color: #6A91B0;
}
/*----------------COMMENTAIRE----------------*/
.comment_normal, .comment_admin {
width: 100%;
}
div.commentheader{
background-color: #6A91B0;
border-top-left-radius: 10px;
border-top-right-radius: 10px;
margin-bottom: 8px;
margin-top: 28px;
font-family: arial;
padding: 5px;
position: relative;
}
.block-reply li .commentheader{
border-radius: 3px;
}
div.commentbody {
border-bottom-left-radius: 5px;
border-bottom-right-radius: 5px;
background-color: #DDDDDD;
padding: 10px;
color: #lighgrey;
margin-top: -10px;
}
.block-reply {
border-left: 3px solid #E48069;
}
.comment-reply a{
color: #64796D;
font-family: Arial;
text-transform: uppercase;
font-size: 8px;
letter-spacing: 1px;
}
.comment-reply a:hover{
color: grey;
}
.commentnumber {
font-family: "playmaj";
color: white;
font-size: 20px;
padding-left: 5px;
opacity: 0.6;
}
.commentpseudo {
font-family: "playit";
color: #888888;
font-size: 13px;
letter-spacing: 1px;
text-transform: lowercase;
}
.commentpseudo a {color: white; font-weight: none;}
.commentpseudo a:hover {color: white; opacity: 0.5;}
.commentavatar {
margin-right: 10px;
margin-top: -25px;
position: relative;
padding: 5px;
}
.commentavatar img {
border: 3px solid #6A91B0;
border-radius: 100px;
}
.block-reply li .commentavatar {
margin-right: 5px;
margin-top: -5px;
position: relative;
padding: 5px;}
.commentdate {
padding-top: 5px;
font-size: 10px;
color: white;
opacity: 0.5;
}
/*----------------PIED DE PAGE----------------*/
#footer {
text-align: center;
text-transform: uppercase;
font-size: 9px;
color: #E68D7F;
height: 30px;
width: 400px;
margin-left: 325px;
}
#footer a {
color: #6A91B0;
}
#footer a:hover {
color: #889D92;
}
#footer:after {content: " Thème de Fabule";}
/*----------------HELPBUBBLES----------------*/
#help_bubble {
background-color: #889D92;
color: #F1F1F1;
border: 2px solid #607368;
border-radius: 10px;
opacity: 0.8;
font-weight: bold;
}
/*----------------BOUTONS----------------*/
input[type=button],input[type=submit], button {
margin: 5px;
margin-left: 0px;
min-width: 10px;
min-height: 20px;
background-color: #889D92;
color: white;
font-family: arial;
border: 2px solid #60756A;
text-transform: uppercase;
font-size: 11px;
letter-spacing: 2px;
border-radius: 2px;
}
input[type=button]:hover, input[type=submit]:hover, input[type=reset]:hover, button:hover, .button:hover {
background-color: #6A91B0;
color: white;
font-family: arial;
border: 3px solid #39556C;
}
/*******FORUMS********/
.post_table_msg {
background-color: #E5E5E5;
padding: 10px;
border-top-right-radius: 5px;
border-bottom-right-radius: 5px;
}
.post_table_head {color: #F7F7F7;
font-size: 0px;
}
.post_table_profile img{
border: 2px solid #B1C6D6;
border-radius: 50px;
margin-left: 10px;
margin-top: -10px;
margin-bottom: 20px;
padding: 0px;
}
.post_table_profile a{
color: white;
font-size: 13px;
font-family: consolas;
text-transform: uppercase;
display: block;
width: 76px;
padding: 2px 0px 2px 0px;
background-color: #B1C6D6;
text-align: center;
border-radius: 2px;
margin-top: 20px;
margin-left: 11px;
text-align: center;
}
.post_table_profile a:hover{
opacity: 0.7;
color: white;
}
.post_table_profile {
background-color: #6A91B0;
border-top-left-radius: 3px;
border-bottom-left-radius: 3px;
}
.forum-description {
background-color: #F0F0F0;
border: 1px solid lightgrey;
margin-top: 20px;
margin-bottom: 20px;
padding: 10px;
border-radius: 2px;
color: #333333
}
/*********BALISES***********/
.esp img{
margin: 5px;
max-width: 78px;
border: 3px solid white;
outline: 1px solid lightgrey;
}
.liens a{
display: inline-block;
width: 47%;
padding: 2px;
text-transform: uppercase;
text-align: center;
font-size: 10px;
background-color: #E0E0E0;
border: 1px solid lightgrey;
margin: 2px;
color: grey;
}CODE HTML "LINKS":
<div class="liens">
tes liens ici
</div>CODE HTML "BLOGROLL":
<div class="esp">
tes images ici
</div>
-
Comments
Coucou tu pourrais s'il te plait m'installer le menu,parceque je suis vraiment pas doué.
Merci d'avance :)
Coucou !Ce thème est juste magnifique ! Je te le prends ! Par contre, j'ai un petit soucis avec le menu, ce serait possible que tu m'aides ?
Plop, ce thème est magnifique **
Est-ce que c'est possible de m'en inspirer pour mon prochain thème ? (Je te créditerai bien sûr)
Ca fait hyper longtemps que je ne suis pas venue ici ! C'est très joli, du coup je le prends pour mon nouveau blog hihi
Je pense ajouter un petit fond derrière et élargir un peu la page si ça ne dérange pas !
je sais pas si je le prends et je le modifie mais normalement je devrais le prendre c:
holà, juste pour dire que j'ai emprunté le css de ce magnifique thème ! je créditerais évidement ^^
Je le prends, il est magnifique ! Merci à toi pour ce travail de qualité :)
j'aime beaucoup :)
c'est si simple et minimaliste, ça fait tout son charme !
Add comment
Oh que c'est beau *-*
oulàlàlàlàlàlàlàlà.
j'aime. uwu
Merci, ça fait plaisir! c:
merci merci! ;;