Linpot SEXE : MESSAGES : 5747
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 5:20 | |
| Ca m'étonne qu'il n'y ai que ça ^^' Copie bien tout ! |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 5:23 | |
| Oh mais tout xDD - Code:
-
a:hover{text-transform:uppercase;} body { background-color : #e1d2ae; background-image:url (http://i46.tinypic.com/sfi7w7.png); background-repeat:no-repeat; background-position: top-center; background-attachment: scroll; background-repeat: no-repeat; }
a.forumlink:link, a.forumlink:visited { font-size: 20px; text-align : left ; color: #d74140; font-weight: normal; font-family : Verdana ; letter-spacing: 4px; padding-left: 50px; padding-right: 3px; padding-bottom: 3px; padding-top: 3px; margin-left:12px; margin-right:12px; text-shadow: 1px 1px 3px #FFFFFF; display: block; border-bottom: dashed 4px #FFFFFF; } a.forumlink:hover, a.forumlink:hover:visited { color: #d74140; display: block; border-bottom: dotted 4px #ffffff; }
/* ***************** CSS DE LA PAGE D'ACCUEIL ******************** by mimizZ | www.graph-forum.com Droit à la modification des couleurs et du fond uniquement ****************************************************************** */
#EnTete { position:relative; /* largeur et hauteur de l'image */ width:800px; height:500px; }
#EnTete #Bande { position:absolute; /* positionnement de la bande par rapport à la page d'accueil */ left:119px; top:100px; /* largeur et hauteur de la bande */ width:531px; height:72px; background-image: url('http://img15.hostingpics.net/pics/776869Bandeau.png'); }
.titre2 { /* TITRE "PRÉSENTATION */ position:absolute; /* positionnement de la banche par rapport à l'image */ left:175px; top:16px; font-family:Helvetica Neue; text-transform:uppercase; color:#535353; font-weight:bold; font-size:24px; letter-spacing:-1px; text-shadow:1px 1px 1px #fff; }
.titre2:hover {color:#00abea;}
a:link{ cursor: pointer;} a, a:hover {text-decoration:none;}
.titre { /* TITRE " BIENVENUE SUR LE FORUM " */ font-family:Helvetica Neue; text-transform:uppercase; letter-spacing:-1px; font-weight:bold; font-size:38px; color:#eeeeee; text-shadow: 1px 2px 1px #c3c3c3; text-align:center; -webkit-border-radius: 10px; -webkit-border-bottom-right-radius: 40px; -webkit-border-bottom-left-radius: 40px; -moz-border-radius: 10px; -moz-border-radius-bottomright: 40px; -moz-border-radius-bottomleft: 40px; border-radius: 10px; border-bottom-right-radius: 40px; border-bottom-left-radius: 40px; background-color:#909090; border-bottom: 3px solid #cccccc; padding:5px; }
.titre:hover {letter-spacing:0px;}
.presentation { /* CADRE TURQUOISE " PRÉSENTATION " */ margin-right:-4px; margin-left:-10px; background-color:#00b9e9; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; box-shadow: 0px 0px 5px #000; width:430px; height:auto; padding-bottom:8px; padding-left:16px; padding-right:16px; padding-top:50px; }
.presentation p { /* ZONE DE TEXTE PRÉSENTATION */ background-color:#FFF; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; border-bottom: 3px solid #84d0f0; border-left: 3px solid #84d0f0; border-right: 3px solid #84d0f0; color:#666; font-family:calibri; font-size:13px; text-align:justify; padding:20px; }
.navigation { /* LIENS */ font-family:"Courier New", Courier, monospace; text-transform:uppercase; -webkit-border-top-left-radius: 30px; -webkit-border-bottom-left-radius: 30px; -moz-border-radius-topleft: 30px; -moz-border-radius-bottomleft: 30px; border-top-left-radius: 30px; border-bottom-left-radius: 30px; width:125px; background-color:#a6d013; font-size:12px; text-align:center; text-shadow:0px 0px 3px #666; margin-left:15px; margin-top:12px; padding: 3px; border-bottom:2px solid #e9ff9a; }
.navigation:hover { background-color:#fff15f; text-shadow:0px 0px 3px #fff; letter-spacing:1px; border-bottom:2px solid #ffd05f; }
.navigation a {color:#FFF} /* COULEUR DES LIENS */ .navigation a:hover {color:#F60} /* COULEUR DES LIENS AU SURVOL */ .annonces { /* ANNONCES QUI DÉFILENT */ width:170px; max-height:185px; -webkit-border-top-right-radius: 30px; -webkit-border-bottom-right-radius: 30px; -moz-border-radius-topright: 30px; -moz-border-radius-bottomright: 30px; border-top-right-radius: 30px; border-bottom-right-radius: 30px; background-color:#61569d; padding-top:8px; padding-bottom:8px; padding-right:10px; box-shadow: 1px 0px 4px #000; border-left:thin solid #000; text-align:center; }
.titre3 { /* TITRE " ANNONCE " */ color:#ab8cbc; font-size:19px; font-family:helvetica neue; text-transform:uppercase; letter-spacing:-1px; font-weight:bold; text-align:center; text-shadow: 2px 2px 1px #4a4179; }
.titre3:hover { color:#d6c8f5; letter-spacing:0px; }
.annonces p { /* ZONE DE TEXTE " ANNONCES */ color:#666; font-family:calibri; font-size:13px; background-color:#FFF; -webkit-border-top-right-radius: 20px; -webkit-border-bottom-right-radius: 20px; -moz-border-radius-topright: 20px; -moz-border-radius-bottomright: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; text-align:justify; padding:8px; border-right:3px solid #d6c8f5; border-bottom:3px solid #d6c8f5; }
.html-marquee {height:125px;} /* PERMET DE LE DÉFILEMENT DES ANNONCES, NE PAS TOUCHER ! */ .html-marquee2 {height:31px;} /* PERMET DE LE DÉFILEMENT DES PARTENAIRES, NE PAS TOUCHER ! */
.partenaires { /* CADRE DES PARTENAIRES + TITRE */ width:500px; background-color:#f39400; box-shadow: 0px 0px 5px #000; -webkit-border-radius: 50px; -moz-border-radius: 50px; border-radius: 50px; padding-left:250px; padding-right:10px; padding-top:1px; padding-bottom:1px; background-image: url('http://img15.hostingpics.net/pics/874614Partenaires.png'); background-repeat:no-repeat; background-position: left center; }
.partenaires p { /* ZONE OÙ LES LOGOS SONT MIS */ background-color:#FFF; height:31px; padding:6px; -webkit-border-radius: 20px; -moz-border-radius: 20px; border-radius: 20px; border-bottom: 3px solid #f3c200; border-right: 3px solid #f3c200; border-left: 3px solid #f3c200; }
.partenaires img { /* OMBRE PORTÉE SUR LES LOGOS DE PARTENARIAT */ box-shadow: 0px 0px 4px #999; } .credits { /* NE PAS ENLEVER ! */ font-family:calibri; font-size:12px; color:#b5b5b5; padding:10px; text-shadow: 0px 0px 4px #000; text-align:center; } .credits a {color:#e2007a;} .credits a:hover {color:#ea69a0;} /* ********************* FIN DU CODE DE LA PA ********************* */ /* ================================= PERSONNALISATION DU QUI EST EN LIGNE ==================================== Code proposé par Sayuri Corrigé par CSSActif ==================================== */ /* conteneur du QEEL */ .QeelPerso { border: 4px dotted #D74140; /* bordure : épaisseur style couleur */ padding:10px 5px; /* espacement du contenu par rapport à la bordure */ background-color:#BDC3C8; /* couleur de fond */ /* coins arrondis (tous navigateurs) */ -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
/* Centrage image du QEEL */ .ImgQeel {text-align:center;}
/* Mise en forme des liens vers les groupes */ .ListeGroupes a { font-size:16px; /* taille du texte */ font-weight:bold; /* épaisseur du texte */ font-style:italic; /* texte en italique */ text-transform:lowercase; /* texte en minuscules */ text-decoration: none!important; /* pas de soulignement du lien */ letter-spacing:1px; /* espacement des lettres */ }
/* Couleurs des groupes */ a.groupe1 { color:#000000 ; } a.groupe2 { color:#5B9B7E ; } a.groupe3 { color:#bf0510 ; } a.groupe4 { color:#e2a69a ; } a.groupe5 { color:#fc6744 ; } a.groupe6 { color:#e9fd0d ; } a.groupe7 { color:#fcc79c ; } a.groupe8 { color:#a19c77 ; } /* Mise en forme des cellules de statistiques */ .statistiques { background-color: #BDC3C8; /* couleur de fond */ border: 4px dotted #7f7757; /* bordure : épaisseur style couleur */ padding:10px; margin:10px; text-align:left; /* alignement texte */ /* coins arrondis */ -moz-border-radius: 10px; -webkit-border-radius: 10px; border-radius: 10px; }
/* Limitation en hauteur des blocs de statistiques */ .BlocStats { overflow:auto; max-height: 200px; /* hauteur maxi */ }
/* Debuggage : on retire le fond de la liste des dernières 24h */ .DeBug td.row1 { background : none; }
/* ================================= PERSONNALISATION DU QUI EST EN LIGNE (fin) ==================================== */ /* ------------- FICHE PV Créee par Orange de CSSActif (http://www.css-actif.com) Merci de conserver cette mention par respect ----------- */ .cssactif_pv { /* Fond de la fiche */ background-color: #f5944e; /* Couleur de fond */ -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */ -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ }
td.cssactif_pv_header { /* En-tête avec image de fond */ background-repeat: no-repeat; /* Empêche la répétition de l'image du header */ background-position: top center; /* Postionne l'image du header en haut, au center */
width: 200px; /* Donne la largeur de la bannière latérale (Largeur de l'avatar) */ height: 320px; /* Donne la hauteur en px du header, l'image de header devrait être même hauteur ou plus grande (Hauteur de l'avatar) */ border-right: 15px double #921628; /* Bordure côté du header: ÉPAISSEURpx STYLE #COULEUR (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#border-style) */ /* Bordures gauche arrondies (voir: http://border-radius.com/) */ -webkit-border-top-left-radius: 20px; -webkit-border-bottom-left-radius: 20px; -moz-border-radius-topleft: 20px; -moz-border-radius-bottomleft: 20px; border-top-left-radius: 20px; border-bottom-left-radius: 20px; text-shadow: 1px 1px 0px #000; /* Ombre du texte */ font-size: 5px; /* Taille du texte: TAILLEpx */ }
div.cssactif_pv_titre h1 { /* Titre prénoms & nom */
font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */
font-size: 32px; /* Taille du texte: TAILLEpx */ text-shadow: 1px 1px 0px #000; /* Ombre du texte */ color: #d51731; /* Couleur du texte */ margin: 0; /* Supprime la marge par défaut de l'élément h1 */ text-align: right; /* Aligne le titre à droite */ text-transform: uppercase; /* Met le titre en majuscules */ }
div.cssactif_pv_titre { /* Titre + feat */ /* Positionne le titre "à cheval" sur la bordure */ position: relative; top: -28px;
text-align: right; /* Aligne le texte à droite */
padding-right: 20px; /* Défifine une marge interne */ color: #CCCCCC; /* Couleur du feat */ }
.cssactif_pv h2 { /* Sous-titres "Identité", "Opinions" etc. */ background-color: #d66158; /* Couleur du fond des sous-titres */ border-color: #FFFFFF; /* Couleur de la bordure */ border-width: 1px 0px; /* Taille de la bordure: HAUT & BAS GAUCHE & DROITE */ border-style: solid; /* Style de la bordure */ -webkit-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 3px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */
text-align: center; /* Aligne le titre au centre */ text-transform: uppercase; /* Met le titre en majuscules */ font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */ color: #921628; /* Couleur du titre */ margin: 0; /* Supprimer marge */ font-size: 20px; /* TAILLE DU TEXTE: TAILLEpx */ font-weight: normal; /*Épaisseur du texte */ text-shadow: 1px 1px 0px #000; /*Ombre du texte */ letter-spacing: 5px; /* Espacement des caractères */ }
.cssactif_pv_content { /* Contenu */ padding: 10px; /* Marge interne */ text-align: justify; /* Justifie le texte */ text-shadow: 1px 1px 0px #000; /*Ombre du texte */ }
.cssactif_pv em { /* Libellés */ font-family: Georgia, "Times New Roman", Times, serif; /*Police du titre (voir: http://www.css-actif.com/t66-css-cours-elementaire-1-le-groupement#forme_caracteres) */ color: #000000; /* Couleur du titre */ font-style: normal; text-transform: uppercase; }
div.infobulle { position: relative; cursor:pointer; /*donne au curseur la forme de petite main, comme sur un lien*/ display: inline-block; /*Place les icones un à côté de l'autre */ margin: 10px; /* marge entre les icones */ border: 1px solid #333; /* bordure des icones */ -webkit-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 5px 0px #000000; /* Ombre de l'icone (voir http://css3generator.com/ choix "Box-shadow") */
}
div.infobulle img { height: 50px; width: 50px; }
div.infobulle div{ display: none; /* ceci masque l'infobulle */ } div.infobulle:hover { background: none; /* correction d'un bug IE */ z-index: 500; /* on définit une valeur pour l'ordre d'affichage */
} div.infobulle:hover div{ display: block; /* ceci affiche l'infobulle */ position: absolute;
width: 50px; /* Largeur de l'infobulle */
top: 50px; /* on positionne notre infobulle */ left: 0px;
background-color: #f5944e; /* Couleur de fond */ -webkit-border-radius: 20px; /* Bordures arrondies (voir: http://border-radius.com/) */ -moz-border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ border-radius: 20px;/* Bordures arrondies (voir: http://border-radius.com/) */ -webkit-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ -moz-box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ box-shadow: 0px 0px 10px 0px #000000; /* Ombre de la fiche (voir http://css3generator.com/ choix "Box-shadow") */ border-left: 6px double #921628; padding: 10px; /* marge interne de l'infobulle */ } /* ------------- FIN FICHE PV */
|
|
Linpot SEXE : MESSAGES : 5747
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 5:32 | |
| Tu supprimes ça :
#EnTete #Bande { position:absolute; /* positionnement de la bande par rapport à la page d'accueil */ left:119px; top:100px;
Et tu le remplaces par ça :
#EnTete #Bande { position:absolute; /* positionnement de la bande par rapport à la page d'accueil */ center:119px; top:100px;
Ensuite tu me dis si ça marche. :) |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 5:37 | |
| |
|
Linpot SEXE : MESSAGES : 5747
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 5:57 | |
| Punaise... Bah sinon je peux me connecter sur ton compte au lieu de m'inscrire, comme ça je regarde le pa ? Tu me donnes ton mdp par mp |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Dim 7 Oct - 6:34 | |
| Je t'ai envoyée un message ;) |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Lun 8 Oct - 4:00 | |
| Oulaaaa, tu m'as déréglé plusieurs truc la laisse faire, je refait un forum. |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Lun 8 Oct - 4:56 | |
| Ah oui & désolée du double post, mais pour l'icons "news" c'est possible que tu mettes la tête de Chunji & C.A.P (ils sont au millieu) :) |
|
Linpot SEXE : MESSAGES : 5747
| Sujet: Re: Design pour tout nouveau forum. Lun 8 Oct - 6:33 | |
| Aïe, désolée je trouve pas du tout comment faire ! |
|
Shin Chan. SEXE : MESSAGES : 75
| Sujet: Re: Design pour tout nouveau forum. Lun 8 Oct - 6:57 | |
| |
|
Linpot SEXE : MESSAGES : 5747
| Sujet: Re: Design pour tout nouveau forum. Sam 13 Oct - 21:33 | |
| L'entête n'est pas à sa taile réelle, si ? Heu, là je sais pas du tout :$ Je suis vraiment pas douée en codage, je sais pas comment faire ^^' |
|
| Sujet: Re: Design pour tout nouveau forum. | |
| |
|