Sujet Précédent Sujet Suivant

Changer le thème Fluxbb/Site

jeasonp Messages postés 274 Date d'inscription   Statut Membre Dernière intervention   -  
jeasonp Messages postés 274 Date d'inscription   Statut Membre Dernière intervention   -
Bonjour, je voudrais changer le thème de mon Forum fluxbb pour qu'il ressemble à mon site http://cluster1.easy-hebergement.net/

Mais je ne comprend pas le systeme de Main.cpl et le Css

Main.tpl 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<pun_language>" lang="<pun_language>" dir="<pun_content_direction>"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 
<pun_head> 
</head> 
<body> 

<div id="pun<pun_page>" class="pun"> 
<div class="top-box"><div><!-- Top Corners --></div></div> 
<div class="punwrap"> 

<div id="brdheader" class="block"> 
 <div class="box"> 
  <div id="brdtitle" class="inbox"> 
   <pun_title> 
   <pun_desc> 
  </div> 
  <pun_navlinks> 
  <pun_status> 
 </div> 
</div> 

<pun_announcement> 

<div id="brdmain"> 
<pun_main> 
</div> 

<pun_footer> 

</div> 
<div class="end-box"><div><!-- Bottom corners --></div></div> 
</div> 

</body> 
</html>


Css du site 

/*COPYRIGHT CSS PAR kitgraphiquegratuit.org*/   
/*************** STRUCTURE PRINCIPALE ***************/    
*  { 
     margin:0; 
     padding:0; 
} 
body, html { 
    height:100%; 
    background:#000 url(images/fond.jpg) repeat-x center top; 
    background-attachment: fixed; 
    font-family:tahoma, Verdana, Arial, Helvetica, sans-serif; 
    font-size: 100%; 
    font-size:0.9em; 
    color:#FFF; 
} 

img, p, h1, h2, h3, h4, h5, h6, Span, object, table, td, tr, form { 
    border:0; 
    margin:0; 
    padding:0; 
}  

#conteneur { 
    margin:0 auto; 
    padding:0; 
    width:920px; 
}      
#header { 
    background:url(images/header.gif); 
    width:915px; 
    height:170px; 
    text-align:left; 
    padding:0 0 0 5px; 
    position:relative; 
    z-index: 9999; 
}  
#contenu { 
    background:url(images/contenu.png); 
    width:900px; 
    padding:0 10px; 
    text-align:left; 
}    
#colonne_gauche { 
    float: left; 
    width:700px; 
    margin:0; 
    padding:0; 
}    
#colonne_droite { 
    width:195px; 
    margin:0 0 0 700px; 
    padding:0; 
    text-align:left; 
    overflow:hidden; 
}        
.petit_cadre_haut { 
    background:url(images/petit_cadre_haut.png); 
    width:195px; 
    height:12px; 
}     
.petit_cadre_fond { 
    background:url(images/petit_cadre_fond.png); 
    width:183px; 
    padding:0 6px; 
    color:#626262; 
    text-align:center; 
 margin:0 auto; 
} 
.petit_cadre_bas { 
    background:url(images/petit_cadre_bas.png); 
    width:195px; 
    height:15px; 
} 
.cadre {         
    margin:0 auto 20px auto; 
    width:654px; 
    text-align:left; 
    background:#272c30; 
    padding:10px; 
    position:relative; 
    -moz-border-radius: 6px 6px 6px 6px; 
    -webkit-border-radius: 6px 6px 6px 6px; 
    border-radius: 6px 6px 6px 6px; 
    box-shadow: 0px 1px 5px #000; 
} 
.petit_cadre {  
    float:left; 
    margin:0 auto 20px 14px; 
    width:310px; 
    text-align:left; 
    background:#272c30; 
    padding:10px; 
    position:relative; 
    -moz-border-radius: 6px 6px 6px 6px; 
    -webkit-border-radius: 6px 6px 6px 6px; 
    border-radius: 6px 6px 6px 6px; 
    box-shadow: 0px 1px 5px #000; 
} 

.block {        
    margin:0 auto 20px auto; 
 width:654px; 
 text-align:left; 
 background:#272c30; 
 padding:10px; 
 position:relative; 
 -moz-border-radius: 6px 6px 6px 6px; 
 -webkit-border-radius: 6px 6px 6px 6px; 
 border-radius: 6px 6px 6px 6px; 
 box-shadow: 0px 1px 5px #000; 
}          
.prez { 
    background:url(images/prez.png); 
 width:136px; 
 padding:0; 
 text-align:center; 
 height:162px; 
} 
.prez  img { 
    position:absolute; 
 bottom:35px; 
 left:50%; 
 margin-left:-50px; /*On indique la moitié de la taille de l'image avec - devant*/ 
} 
.info { 
    font-size:0.7em; 
 padding:3px 4px; 
 width:136px; 
 margin:-20px 15px 0 5px; 
 color:#3b4349; 
 font-weight:bold; 
 float:left; 
 position:relative; 
 background:#e6e6e6; 
 -moz-border-radius: 6px 6px 6px 6px; 
 -webkit-border-radius: 6px 6px 6px 6px; 
 border-radius: 6px 6px 6px 6px; 
 box-shadow: 0px 1px 2px #000; 
} 
p.info1 { 
 color:#FFF; 
 font-size:1.1em; 
 font-weight:normal; 
 float:left; 
 -moz-border-radius: 9px 9px 9px 9px; 
 -webkit-border-radius: 9px 9px 9px 9px; 
 border-radius: 9px 9px 9px 9px; 
    background:#272c30; 
 padding:3px 5px; 
}  
p.info2 { 
 color:#FFF; 
 font-size:1.1em; 
 font-weight:normal; 
 float:right; 
 -moz-border-radius: 9px 9px 9px 9px; 
 -webkit-border-radius: 9px 9px 9px 9px; 
 border-radius: 9px 9px 9px 9px; 
    background:#2c9325; 
 padding:3px 5px; 
}  
/**************** PIED ****************/  
#pied { 
    width:920px; 
 padding:0; 
 text-align:center; 
 height:58px; 
 background:url(images/pied.png); 
} 
#mentions { 
 position:relative; 
    float:right; 
    width:170px; 
    color:#131313; 
    text-align:center; 
    margin:0 10px 0 10px; 
    background:#d6d6d6; 
    padding:10px 10px 16px 10px; 
    -moz-border-radius: 6px 6px 0 0; 
    -webkit-border-radius: 6px 6px 0 0; 
    border-radius: 6px 6px 0 0; 
    background: -moz-linear-gradient(top, #d6d6d6 30%, #FFF); 
    background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d6d6d6), to(#FFF)); 
    -pie-background: linear-gradient(#d6d6d6, #FFF 100%);  
} 
#mentions  a { 
    color:#131313; 
 text-decoration:none; 
 outline:none; 
 font-weight:normal; 
 font-size:13px; 
} 
#mentions  a:hover,  
#partenaires  ul  li  a:hover { 
    color:#2c9325; 
} 
#reseaux { 
    position:relative; 
 float:right; 
 width:170px; 
 color:#131313; 
 text-align:center; 
 margin:0 10px 0 0; 
 background:#d6d6d6; 
 padding:10px; 
 -moz-border-radius: 6px 6px 0 0; 
 -webkit-border-radius: 6px 6px 0 0; 
 border-radius: 6px 6px 0 0; 
 background: -moz-linear-gradient(top, #d6d6d6 30%, #FFF); 
 background: (linear, 0% 0%, 0% 100%, from(#d6d6d6), to(#FFF)); 
 -pie-background: linear-gradient(#d6d6d6, #FFF 100%);  
} 
#partenaires { 
    position:relative; 
 text-align:center; 
 float:left; 
 width:440px; 
 color:#131313; 
 margin:0 10px 0 10px; 
 background:#d6d6d6; 
 padding:10px; 
 -moz-border-radius: 6px 6px 0 0; 
 -webkit-border-radius: 6px 6px 0 0; 
 border-radius: 6px 6px 0 0; 
 background: -moz-linear-gradient(top, #d6d6d6 30%, #FFF);background:  
 -webkit-gradient(linear, 0% 0%, 0% 100%, from(#d6d6d6), to(#FFF)); 
 -pie-background: linear-gradient(#d6d6d6, #FFF 100%);  
} 
#partenaires  ul#dernier { 
    float:left; 
    margin:0; 
 padding:0; 
 text-align:center; 
 width:140px; 
 list-style-type: none; 
 border:none; 
 margin:0; 
} 
#partenaires  ul{ 
    float:left; 
    margin:0; 
 padding:0; 
 text-align:center; 
 width:140px; 
 border-right:1px solid #131313; 
 list-style-type: none; 
 margin:0; 
} 

#partenaires  ul  li  a { 
    color:#131313; 
    text-decoration:none; 
    outline:none; 
    font-weight:normal; 
    font-size:12px; 
} 
#partenaires table { 
    margin:0 auto; 
 text-align:center; 
} 
p.piedpage { 
    position:relative; 
    color:#FFF; 
    font-size:12px; 
    font-weight:normal; 
    background:#272c30; 
    padding:2px 0 2px 0; 
    margin:0 0 10px 0; 
 -moz-border-radius: 4px 4px 4px 4px; 
 -webkit-border-radius: 4px 4px 4px 4px; 
 border-radius: 4px 4px 4px 4px; 
} 

/**************** MENU ****************/  
#menu { 
    list-style:none; 
    width:920px; 
    margin:0; 
    height:37px; 
 padding:0; 
} 
#menu li { 
    float:left; 
    display:block; 
    text-align:center; 
    position:relative; 
    border:none; 
} 
#menu li a { 
    font-family:Arial, Helvetica, sans-serif; 
    font-size:14px;  
    color: #000; 
    display:block; 
    outline:0; 
    text-decoration:none; 
} 
#menu li .drop { 
    background:url(images/menu.png) right no-repeat; 
    width:130px; 
    height:44px; 
    padding:9px 0 0 0; 
 color:#525252; 
    font-size:12px; 
    font-weight:bold; 
}   
#menu li:hover .drop { 
    background:url(images/menu.png) left no-repeat; 
    width:130px; 
    height:24px; 
    padding:29px 0 0 0; 
} 
#menu li .drop_vide { 
    background:url(images/menu.png) right no-repeat; 
    width:130px; 
    height:44px; 
    padding:9px 0 0 0; 
    cursor:default; 
}   
.dropdown_1column, .dropdown_2columns, .dropdown_3columns, .dropdown_4columns,.dropdown_5columns { 
 margin:0 auto 0 1px; 
 float:left; 
 position:absolute; 
 left:-999em; 
 text-align:left; 
 padding:10px 5px 10px 5px; 
 border-top:none; 
 color:#787878; 
 background:#FFF; 
 background: -moz-linear-gradient(top, #fcfdff, #e2e3e5); 
 background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#fcfdff), to(#e2e3e5)); 
 -pie-background: linear-gradient(#e2e3e5, #fcfdff 100%);  
    border:1px solid #d4d6d7; 
 -moz-border-radius: 0px 5px 5px 5px; 
 -webkit-border-radius: 0px 5px 5px 5px; 
  border-radius: 0px 5px 5px 5px; 
 z-index: 9999; 
 box-shadow: 0px 1px 2px #000; 
} 
.dropdown_1column  {width: 190px;} 
.dropdown_2columns {width: 280px;} 
.dropdown_3columns {width: 420px;} 
.dropdown_4columns {width: 560px;} 
.dropdown_5columns {width: 700px;} 
#menu li:hover .dropdown_1column, #menu li:hover .dropdown_2columns, #menu li:hover .dropdown_3columns,#menu li:hover .dropdown_4columns,#menu li:hover .dropdown_5columns { 
 left:-1px;top:auto; 
 } 
.col_1,.col_2,.col_3,.col_4,.col_5 { 
 display:inline; 
 float: left; 
 position: relative; 
 margin-left: 5px; 
 margin-right: 5px; 
 color:#787878; 
} 
.col_1 {width:170px;} 
.col_2 {width:270px;} 
.col_3 {width:410px;} 
.col_4 {width:550px;} 
.col_5 {width:690px;} 
#menu li ul { 
    width:140px; 
 float:left; 
    list-style:none; 
    padding:5px; 
    margin:0 10px; 
 background:#f3f3f3;   
 border:1px solid #dfdfdf;  
 -moz-border-radius: 6px 6px 6px 6px; 
 -webkit-border-radius: 6px 6px 6px 6px; 
  border-radius: 6px 6px 6px 6px; 
} 
#menu li ul li { 
    font-size:12px; 
    line-height:14px; 
    float:none; 
    text-align:left; 
 margin:0; 
 padding:0; 
} 
#menu li ul li:hover { 
    background:none; 
    border:none; 
    padding:0; 
    margin:0; 
} 
#menu li:hover div a { 
    font-size:12px; 
 margin:0; 
 padding:0; 
    color:#818b92 
} 
#menu li:hover div a:hover { 
    color:#2c9325; 
    font-weight:normal; 
} 

#menu li .drop #ico_menu { 
    position:absolute; 
    margin:-20px 0 0 60px; 
    width:16px; 
    height:16px; 
    background-repeat:no-repeat; 
    left:-999em; 
} 
#menu li:hover .drop #ico_menu { 
    left:-1px; 
    top:auto; 
} 
/****************ZONE MEMBRE****************/ 
p#login{ 
    font-size:11px; 
 color:#787878; 
} 
p#mdp { 
 font-size:11px; 
 color:#787878; 
} 
input { 
 width:120px; 
 height:25px; 
 margin:2px 0; 
} 
#inscription  { 
 float:right; 
 width:120px; 
 border-left:1px solid #787878; 
 padding:0 0 0 10px; 
 margin:5px 0 0 0; 
 font-size:11px; 
} 
.separation { 
 border-bottom:1px dotted #787878; 
 margin:10px 0; 
 width:100px; 
 height:1px; 
} 
#bt_connexion { 
 border:1px solid #e8e8e8; 
 color:#787878; 
 padding:0px 5px 0 5px; 
 background:#096a02; 
 text-align:center; 
 display:inline; 
 margin:5px 0 5px 5px; 
 width:70px; 
 height:20px; 
 cursor:pointer  
} 
/****************NEWSLETTER****************/ 
input#newsletter { 
 width:130px; 
 height:25px; 
 margin:5px 0 5px 0; 
 display:inline; 
} 
#bt_newsletter { 
border:1px solid #b0b0b0; 
color:#787878;padding:3px 5px; 
background:#FFF; 
text-align:center; 
display:inline; 
margin:5px 0 5px 5px; 
width:20px; 
height:20px; 
cursor:pointer; 
} 
/*************** SLIDE ***************//* Featured Content Slider by: Chris Coyier */                                       
#page-wrap {  
    margin:0 auto; 
    width: 160px;  
    position: relative;  
    min-height:240px; 
} 
ul {  
    list-style: square inside;  
} 
blockquote {  
    padding: 0 20px;  
    margin-left: 20px;  
    font-size: 14px;  
    font-family: Georgia, serif;  
    font-style: italic;  
    margin-top: 10px; 
} 
.slider-wrap { width: 160px; 
    float:right; 
    height:240px; 
}    
.panel ul {  
    text-align: left;  
    margin: 0 15px 0 30px;  
} 
.stripViewer {  
    position: relative;  
    overflow: hidden;  
    width: 160px;  
    height:240px;  
} 
.stripViewer .panelContainer {  
    position: relative;  
} 
.stripViewer .panelContainer .panel {  
    float: left; 
    height: 100%;  
    position: relative;  
    width: 160px;  
} 
.stripNavL, .stripNavR, .stripNav {  
    display: none;  
} 
#movers-row {  
    margin: 0;  
    width:160px; 
} 
#movers-row div {  
    float: left;  
    width:160px; 
    margin: 0; 
} 
#movers-row div a.cross-link {  
    float: left; 
    margin:5px 0 0 2px;  
} 
.photo-meta-data { 
    background: url(images/transpBlack.png);  
 padding: 10px;  
 height: 30px;  
 margin-top: -52px; 
 width:502px;  
 position: relative;  
 z-index: 9998;  
 color: white;  
} 
.photo-meta-data span {  
    font-size: 13px;  
} 
.cross-link {  
    display: block;  
 width:50px; 
 height:44px; 
 position:relative;  
 z-index: 9998;  
 margin: 0; 
 padding:6px 0 0 0; 
 background:url(images/fpis.png); 
}  
/************CLASS POUR PRÉSENTATION KIT************/ 
#drp { 
    background:#e9e9e9; 
    border:1px solid #c3c3c3; 
    padding:10px; 
    width:250px; 
    margin:5px; 
    -moz-border-radius: 5px 5px 5px 5px; 
    -webkit-border-radius: 5px 5px 5px 5px; 
    border-radius: 5px 5px 5px 5px; 
} 
/************FLASH INFO************/ 
#window  { 
    width:183px;  
    height:40px;  
    overflow:hidden;  
    position:relative;  
} 
#slideshow { 
    width:400px;  
    height:700px;  
    overflow:hidden;  
    position:relative; 
    font-size:12px; 
} 
#slideshow li { 
    width:183px;  
    height:40px;  
    float:left;  
    display:inline; 
} 
/************ BALISE GÉNÉRIQUE************/ 
a                             {color:#FFF;text-decoration:none;outline:none}   
a:hover                  {color:#2c9325;}   
span.vert               {color:#2c9325;}  
span.grand              {color:#2c9325;font-size:14px;font-weight:bold;} 
span#welcome          {font-size:13px;font-weight:bold;color:#787878;display:inline;} 
p.italic                {font-style:italic;} 
h1                           {font-size:13px;} 
h2                           {font-size:14px;} 
h3                           {font-size:15px;} 
h4                           {font-size:16px;} 
h5                           {font-size:17px;} 
h6                           {font-size:18px;} 
h1, h2, h3, h4, h5, h6 {font-weight:bold} 
hr                            {width:50%;margin:10px 0}


Si quelqu'un pourrait m'aider Svp

Cordialement JeasonP



Étudiant en Infographiste à votre service.
J'ai quelque Base en Html, Php et en programme d'Adobe.
A voir également:

1 réponse

Réponse 1 / 1
jeasonp Messages postés 274 Date d'inscription   Statut Membre Dernière intervention   8
 
Je vient de m'en sortir avec un Frame, sa pourrait être viable a long terme ? Je pense que les Frames n'ont pas bonne réputation :/
0

Discussions similaires

Coco Chat : nouveau lien !
LoupiotteDesTenebres -
brucine -

9 réponses
'Votre colis est dans le site de livraison qui dessert votre adresse' que faire
relakztek82 -
Unemeuf -

25 réponses