Page d'accueuil petite modif d'un code
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1 • Partagez
Page d'accueuil petite modif d'un code
Bonjour,
Il y a peu de temps j'ai passé une commande ici,je souhaiterais simplement modifier un peu le code pour enlever la partie "liens utiles".
Voilà le code html :
Et le css
Merci.
Il y a peu de temps j'ai passé une commande ici,je souhaiterais simplement modifier un peu le code pour enlever la partie "liens utiles".
Voilà le code html :
- Code:
<table width="800px">
<tr>
<td rowspan="3" width="300px">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Le staff</div></div><br><div class="boite1">
<img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t14.jpg" class="transparence"><br><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t16.jpg" class="transparence"><img src="URL DE L'IMAGE" class="transparence"><img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence">
</div></td>
<td rowspan="2" width="350px">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Bienvenue sur ROTN</div></div><br><div class="boite2">
<div style="height:200px;overflow:auto;width: 300px;
padding: 10px;">
Tu viens d'arriver dans le monde le plus cruel qui soit avec des créatures dont tu ignorais l'existence avant. Les vampires se sont dévoilés au grand jour inspirant la panique général chez les humains. Les elfes,eux,n'avaient rien à s'inquiéter,car ils bénéficient d'une infaillible protection. Les rois et reines se sont mis d'accord,chacun devraient rester sur son territoire sinon il y aurait des problèmes.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
Ensuite tu as avec toi des anges et des démons dont tous ignorent leur race. Une guerre menace d'éclater dans ce beau ciel bleu qui risque d'être souillé de sang tout comme le sol. Pour couronner le tout,une autre guerre risque d'apparaître entre les elfes et les humains contre les vampires. La tristesse,la joie,le bonheur comme le malheur sont au rendez-vous.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
<br>
Tu as une histoire,un passé,un présent et un futur.
Que feras-tu quand tu mettras les pieds dans ce monde où la guerre le menace ?
</div></div></td>
<td rowspan="3" width="300px; height: 150px;">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Annonces</div></div><br><div class="boite1">
<span><marquee behavior="scroll" direction="down" scrollamount="1" height="250">
<center>~ Annonce 1<br>
~ Annonce 2<br>
~ Annonce 3<br>
~ Annonce 4<br>
~ Annonce 5<br>
~ Annonce 6<br>
</marquee></span></center>
</div></td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" width="400px"><div class="boite4">
<img src="http://www.servimg.com/u/f31/16/91/07/21/sans_t10.jpg">
</div></td>
</tr>
<tr>
<td width="200px">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Liens utiles</div></div><br><div class="boite3">
<table style="height:200px;width:100%;">
<tr><td style="vertical-align:top;text-align:center;width:100%;">
<script src="http://www.archive-host.com/files/775966/96de005e35ffd2b9823d2b1d229d90d18341a601/cssllistederoulanteavecnavigateur.js"></script>
<script src="http://www.archive-host.com/files/775967/96de005e35ffd2b9823d2b1d229d90d18341a601/csslistederoulante.js"></script>
<!-- script du menu -->
<script type="text/javascript" src="dynMenu.js"></script>
<!-- détéction du navigateur -->
<script type="text/javascript" src="browserdetect.js"></script>
<!-- liste imbriquée de liens qui fera office de menu -->
<ul id="menu">
<li><a href="#menu1">Tout d'abord</a>
<ul>
<li><a href="#"><a href="http://regionofthenight.forum-canada.com/t99-reglement">Règlement</a> </a></li>
<li><a href="#"><a href="LienLienLien">Contexte</a></a>
</li>
</li>
<li><a href="#"><a href="LienLienLien">Métier</a></a></li>
<li><a href="#"><a href="LienLienLien">Carte</a></a>
</li>
</ul>
</li>
<li><a href="#menu2" >Votre personnage</a>
<ul>
<li><a href="#"><a href="LienLienLien">Les prédéfinis</a></a></a></li>
<li><a href="#"><a href="LienLienLien">texte</a></a></a></li>
<li><a href="#">élément 3eeee</a></li>
</ul>
</li>
<li><a href="#menu3" >menu 3</a>
<ul>
<li><a href="#">élément 1rrr</a></li>
<li><a href="#">élément 2ttt</a></li>
<li><a href="#">élément 3yyy</a></li>
</ul>
</li>
</ul>
<script type="text/javascript">
initMenu();
</script>
</td></tr></table></div></td>
</tr>
</table>
<br>
<center><div class="partenaires"><p><marquee class="html-marquee2" direction="left" scrollamount="3" onmouseover=this.stop(); onmouseout=this.start();>
<a href="http://www.clanofthemoon.forumgratuit.org" target="_blank"><img src="http://nsa27.casimages.com/img/2011/07/16/110716100821717052.jpg"></a>
<a href="http://lifehouse-fan.kazeo.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t12.jpg"></a>
<a href="http://lifehouse-fan.forum-canada.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t13.jpg"></a>
</marquee></p></div></center>
Et le css
- Code:
/* effet de transparence image */
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.transparence2 {
margin: 3px;
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence2:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.titre1{
color: #8F3D3D;
font-family: georgia;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align: center;
}
.html-marquee2 {height:31px;}
.partenaires {
background-color: #0E0E0E;
background-image: url(http://img15.hostingpics.net/pics/874614Partenaires.png);
background-position: left center;
background-repeat: no-repeat;
padding: 1px 10px 1px 250px;
width: 500px;
}
.partenaires p {
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
background-color: #0E0E0E;
border-bottom: 3px solid #0E0E0E;
border-left: 3px solid #0E0E0E;
border-radius: 20px;
border-right: 3px solid #0E0E0E;
height: 31px;
padding: 6px;
}
.partenaires img {
box-shadow: 0px 0px 4px #999; }
.boite1 {
background-color: #0E0E0E;
padding: 14px;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}
.boite2 {
background-color: #0E0E0E;/*couleur de fond*/
margin-left: 30px;
width: 310px; /*la largeur*/
border-radius: 30px; /*les bordures arrondies pour tout les navigateurs*/
-moz-border-radius: 30px; /*les bordures arrondies pour mozilla*/
-webkit-border-radius: 30px; /*les bordures arrondies pour google chrome*/
}
.chatling {
color: #111;
font-size: 13px;
font-family: trebuchet ms;
line-height: 13px;
}
.boite4{margin-left: 60px;
margin-top: -150px;}
/* CSS du menu vertical, bieler batiste */
.menu{
position:absolute;
/* solve a Opera7/IE display bug */
width:152px;
width/**/:150px;
border-top: 1px #000 solid;
border-left: 1px #000 solid;
border-right: 1px #000 solid;
margin:0;
padding:0;
}
.menu span{
display:none;
}
.menu ul{
border-top: 1px #000 solid;
border-left: 1px #000 solid;
border-right: 1px #000 solid;
margin:0;
padding:0;
position:absolute; /* important */
width:152px;
width/**/:150px;
}
.menu li ul{
visibility:hidden;
}
.menu li ul{
margin-left:150px; /* be careful */
margin-top:-24px;
}
.menu a{
text-align:center;
background-color: #0E0E0E;
color:#000;
text-weight:bold;
display:block;
width:150px;
border-bottom: 1px #000 solid;
text-decoration:none;
margin:0;
padding:3px 0 3px 0; /* em units can creat little graphic bug in mozilla */
}
.menu a:hover{
background-color: #242424;
}
/* for a mozilla better display with key nav */
.menu a:focus{
background-color: #242424;
}
.menu span{
/* hide some accessibility stuff */
display:none;
}
.menu li{
width:150px;
display:block;
float:left;
list-style:none;
margin:0;
padding:0;
}
/* IE PC selector */
* html .menu li {
display:inline; /* solve a IE PC list bug */
float:none; /* solve a IE5 clav nav bug */
}
a.linkOver{
background-color: #eee;
}
Merci.
Dernière édition par Gabee le Mer 26 Sep 2012 - 0:03, édité 1 fois
Re: Page d'accueuil petite modif d'un code
Salut Gabee,
supprime tout le contenu et remplace par ceci:
Ne touche à rien dans ta CSS .
Bonne journée.
a++
supprime tout le contenu et remplace par ceci:
- Code:
<table width="800px">
<tr>
<td rowspan="3" width="300px">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Le staff</div></div><br><div class="boite1">
<img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t14.jpg" class="transparence"><br><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t16.jpg" class="transparence"><img src="URL DE L'IMAGE" class="transparence"><img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence">
</div></td>
<td rowspan="2" width="350px">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Bienvenue sur ROTN</div></div><br><div class="boite2">
<div style="height:200px;overflow:auto;width: 300px;
padding: 10px;">
Tu viens d'arriver dans le monde le plus cruel qui soit avec des créatures dont tu ignorais l'existence avant. Les vampires se sont dévoilés au grand jour inspirant la panique général chez les humains. Les elfes,eux,n'avaient rien à s'inquiéter,car ils bénéficient d'une infaillible protection. Les rois et reines se sont mis d'accord,chacun devraient rester sur son territoire sinon il y aurait des problèmes.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
Ensuite tu as avec toi des anges et des démons dont tous ignorent leur race. Une guerre menace d'éclater dans ce beau ciel bleu qui risque d'être souillé de sang tout comme le sol. Pour couronner le tout,une autre guerre risque d'apparaître entre les elfes et les humains contre les vampires. La tristesse,la joie,le bonheur comme le malheur sont au rendez-vous.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
<br>
Tu as une histoire,un passé,un présent et un futur.
Que feras-tu quand tu mettras les pieds dans ce monde où la guerre le menace ?
</div></div></td>
<td rowspan="3" width="300px; height: 150px;">
<div class="titre1"><div style="text-shadow: 0px 0px 4px red;">Annonces</div></div><br><div class="boite1">
<span><marquee behavior="scroll" direction="down" scrollamount="1" height="250">
<center>~ Annonce 1<br>
~ Annonce 2<br>
~ Annonce 3<br>
~ Annonce 4<br>
~ Annonce 5<br>
~ Annonce 6<br>
</marquee></span></center>
</div></td>
</tr>
<tr>
</tr>
<tr>
<td rowspan="2" width="400px"><div class="boite4">
<img src="http://www.servimg.com/u/f31/16/91/07/21/sans_t10.jpg">
</div></td>
</tr>
</table>
<br>
<center><div class="partenaires"><p><marquee class="html-marquee2" direction="left" scrollamount="3" onmouseover=this.stop(); onmouseout=this.start();>
<a href="http://www.clanofthemoon.forumgratuit.org" target="_blank"><img src="http://nsa27.casimages.com/img/2011/07/16/110716100821717052.jpg"></a>
<a href="http://lifehouse-fan.kazeo.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t12.jpg"></a>
<a href="http://lifehouse-fan.forum-canada.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t13.jpg"></a>
</marquee></p></div></center>
Ne touche à rien dans ta CSS .
Bonne journée.
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
Salut Gabee ,
j'ai modifié tout ton tableau ainsi que la feuille de style,
le résultat est identique .
Supprimes la partie css que tu as déposée ici.
Les quatre parties importantes de ta page d 'accueil se nomment respectivement:
Le bloc complet sans les partenaires:
Elles sont mentionnées et identifiées dans ta css et
ensuite il suffit de les déplacer à ta convenance .
Le code html:
La C.S.S:
a++
j'ai modifié tout ton tableau ainsi que la feuille de style,
le résultat est identique .
Supprimes la partie css que tu as déposée ici.
Les quatre parties importantes de ta page d 'accueil se nomment respectivement:
Le bloc complet sans les partenaires:
- Code:
<div id="M14_tout">
- Code:
<div class="M14_tab1">
- Code:
<div class="M14_tab2">
- Code:
<div class="M14_tab3">
Elles sont mentionnées et identifiées dans ta css et
ensuite il suffit de les déplacer à ta convenance .
Le code html:
- Spoiler:
- Code:
<div id="M14_tout">
<div class="M14_tab1"><div class="titre1">Le staff</div><br><div class="boite1">
<img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t14.jpg" class="transparence"><br><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t16.jpg" class="transparence"><img src="URL DE L'IMAGE" class="transparence"><img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence">
</div>
</div><div class="M14_tab2"><div class="titre1">Bienvenue sur ROTN</div><br><div class="boite2">
Tu viens d'arriver dans le monde le plus cruel qui soit avec des créatures dont tu ignorais l'existence avant. Les vampires se sont dévoilés au grand jour inspirant la panique général chez les humains. Les elfes,eux,n'avaient rien à s'inquiéter,car ils bénéficient d'une infaillible protection. Les rois et reines se sont mis d'accord,chacun devraient rester sur son territoire sinon il y aurait des problèmes.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
Ensuite tu as avec toi des anges et des démons dont tous ignorent leur race. Une guerre menace d'éclater dans ce beau ciel bleu qui risque d'être souillé de sang tout comme le sol. Pour couronner le tout,une autre guerre risque d'apparaître entre les elfes et les humains contre les vampires. La tristesse,la joie,le bonheur comme le malheur sont au rendez-vous.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
<br>
Tu as une histoire,un passé,un présent et un futur.
Que feras-tu quand tu mettras les pieds dans ce monde où la guerre le menace ?<br><br>
</div><div class="M14_image"><img src="http://www.servimg.com/u/f31/16/91/07/21/sans_t10.jpg" border="0" alt="" />
</div>
</div><div class="M14_tab3">
<div class="titre1">Annonces</div><br><div class="boite1">
<span class="annonce_defil"><marquee behavior="scroll" direction="down" scrollamount="1" height="250">
<center>~ Annonce 1<br>
~ Annonce 2<br>
~ Annonce 3<br>
~ Annonce 4<br>
~ Annonce 5<br>
~ Annonce 6<br>
</marquee></center></span>
</div>
</div>
</div>
<div class="partenaires"><p><marquee class="html-marquee2" direction="left" scrollamount="3" onmouseover=this.stop(); onmouseout=this.start();>
<a href="http://www.clanofthemoon.forumgratuit.org" target="_blank"><img src="http://nsa27.casimages.com/img/2011/07/16/110716100821717052.jpg"></a>
<a href="http://lifehouse-fan.kazeo.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t12.jpg"></a>
<a href="http://lifehouse-fan.forum-canada.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t13.jpg"></a>
</marquee></p></div>
La C.S.S:
- Spoiler:
- Code:
/*Le bloc complet sans les partenaires*/
#M14_tout
{
width:100%;
height:420px;
background: #1a1a1a;
-webkit-border-radius: 6px;
border-radius: 6px;
}
/*Partie 1*/
.M14_tab1 {float:left;margin-left:60px;width:200px; }
/*Partie 2*/
.M14_tab2 {position:absolute;margin-left:350px; width:200px; }
/*Partie 3*/
.M14_tab3 {float:right;margin-right:60px;width:200px; height: 150px; }
/*Partie 3 annonces défilantes a droite*/
.annonce_defil {color:#ffffff;font-size:10px;}
/*L image en bas */
.M14_image
{
padding-top:5px;
padding-left:30px;
}
/*Bordures arrondies de l image en bas*/
.M14_image img { -webkit-border-radius: 6px;border-radius: 6px; }
/* effet de transparence image */
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.transparence2 {
margin: 3px;
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence2:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.titre1{
position:relative;
margin-top:15px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align: center;
}
.html-marquee2 {height:31px;}
.partenaires {
background-color: #0E0E0E;
background-image: url(http://img15.hostingpics.net/pics/874614Partenaires.png);
background-position: left center;
background-repeat: no-repeat;
padding: 1px 10px 1px 250px;
width: 500px;
}
.partenaires p {
-webkit-border-radius: 20px;
background-color: #0E0E0E;
border-bottom: 3px solid #0E0E0E;
border-left: 3px solid #0E0E0E;
border-radius: 20px;
border-right: 3px solid #0E0E0E;
height: 31px;
padding: 6px;
}
.partenaires img {
box-shadow: 0px 0px 4px #999; }
.boite1 {
background-color: #0E0E0E;
padding: 14px;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}
.boite2
{
background-color: #0E0E0E;/*couleur de fond*/
height:200px;
overflow:auto;
width: 300px;
padding: 15px 10px 15 px 10px;
color:#ffffff;
font-size:10px;
border-radius: 30px; /*les bordures arrondies pour tout les navigateurs*/
-webkit-border-radius: 30px; /*les bordures arrondies pour google chrome*/
}
.chatling {
color: #111;
font-size: 13px;
font-family: trebuchet ms;
line-height: 13px;
}
#chatbox_header .cattitle:before { content: "M14"; }
#chatbox_header .cattitle strong { visibility: hidden; }
.bloc
{
display: block;
overflow: hidden;
width: 600px;
height: 44px;
transition: 1s all;
-webkit-transition: 1s all;
-moz-transition: 1s all;
-o-transition: 1s all;
-ktm-transition: 1s all;
margin: 0px 4px;
cursor: pointer;
}
.bloc_ferme{
background-color:#121212;
display: inline-block;
height:25px;
width:100px;
padding: 2px;
font: smallcaps 13px arial;
text-align: center;
color: #20aec8;
-webkit-border-top-left-radius: 8px;
-webkit-border-top-right-radius: 8px;
-moz-border-radius-topleft: 8px;
-moz-border-radius-topright: 8px;
border-top-left-radius: 8px;
border-top-right-radius: 8px;
border-bottom: none;
border:1px solid #20aec8;
}
.bloc:hover {
height: 210px;
transition: height 1s linear;
-webkit-transition: height 1s linear;
-moz-transition: height 1s linear;
-o-transition: height 1s linear;
-ktm-transition: height 1s linear;
}
.bloc_ouvert{
background: url(http://r29.imgfast.net/users/2913/73/38/67/smiles/831888.gif)no-repeat center center;
background-color:#141414;
display: inline-block;
width: auto;
font: 12px arial;
text-align: justify;
padding: 4px;
padding-left:5px;
padding-right:5px;
margin-top: 0;
color: #20aec8;
-webkit-border-radius: 8px;
-webkit-border-top-left-radius: 0;
-moz-border-radius: 8px;
-moz-border-radius-topleft: 0;
border-radius: 8px;
border-top-left-radius: 0;
border:1px solid #20aec8;
border-top:none;
}
.bloc_open a {color: #ffffff;}
/* fin bloc message*/
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
Salut Gabee,
on a pas la même largeur sur la P.A .
Soit tu tu mets 80% ici:
Général/Configuration/Général/Structure des pages
Largeur du forum (nombre ou %) : 80%
ou alors on revoit tout ton code .
a++
on a pas la même largeur sur la P.A .
Soit tu tu mets 80% ici:
Général/Configuration/Général/Structure des pages
Largeur du forum (nombre ou %) : 80%
ou alors on revoit tout ton code .
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
Je préfère garder ma largeur de page actuelle (40%)
alors on revoit le code s'il te plaît ^^''
alors on revoit le code s'il te plaît ^^''
Re: Page d'accueuil petite modif d'un code
Salut Gabee,
je te tiens informé dans la semaine .
a++
alors on revoit le code s'il te plaît ^^''
je te tiens informé dans la semaine .
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
D'accord merci =)
Re: Page d'accueuil petite modif d'un code
Salut Gabee,
bon , c'est plus tôt que prévu .
Le code H.T.M.L :
La C.S.S:
Voilà, espérant t'avoir aidé .
a++
bon , c'est plus tôt que prévu .
Le code H.T.M.L :
- Code:
<div id="M14_tout">
<div class="M14_tab1"><div class="titre1">Le staff</div><br><div class="boite1">
<img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t14.jpg" class="transparence"><br><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t16.jpg" class="transparence"><img src="URL DE L'IMAGE" class="transparence"><img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence">
</div>
</div><div class="M14_tab2"><div class="titre2">Bienvenue sur ROTN</div><br><div class="boite2">
Tu viens d'arriver dans le monde le plus cruel qui soit avec des créatures dont tu ignorais l'existence avant. Les vampires se sont dévoilés au grand jour inspirant la panique général chez les humains. Les elfes,eux,n'avaient rien à s'inquiéter,car ils bénéficient d'une infaillible protection. Les rois et reines se sont mis d'accord,chacun devraient rester sur son territoire sinon il y aurait des problèmes.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
Ensuite tu as avec toi des anges et des démons dont tous ignorent leur race. Une guerre menace d'éclater dans ce beau ciel bleu qui risque d'être souillé de sang tout comme le sol. Pour couronner le tout,une autre guerre risque d'apparaître entre les elfes et les humains contre les vampires. La tristesse,la joie,le bonheur comme le malheur sont au rendez-vous.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
<br>
Tu as une histoire,un passé,un présent et un futur.
Que feras-tu quand tu mettras les pieds dans ce monde où la guerre le menace ?<br><br>
</div><div class="M14_image"><img src="http://www.servimg.com/u/f31/16/91/07/21/sans_t10.jpg" border="0" alt="" />
</div>
</div><div class="M14_tab3">
<div class="titre3">Annonces</div><br><div class="boite1">
<span class="annonce_defil"><marquee behavior="scroll" direction="down" scrollamount="1" height="250">
<center>
~ Annonce 1<br>
~ Annonce 2<br>
~ Annonce 3<br>
~ Annonce 4<br>
~ Annonce 5<br>
~ Annonce 6<br>
<img src="http://r24.imgfast.net/users/2913/10/00/00/smiles/2674625213.png"align="absmiddle"><a href="http://www.google.fr/"title="Moteur de recherches, Google est là pour vous.">Une recherche!!!</a><br>
</marquee></center></span>
</div>
</div>
</div>
<div class="partenaires"><p><marquee class="html-marquee2" direction="left" scrollamount="3" onmouseover=this.stop(); onmouseout=this.start();>
<a href="http://www.clanofthemoon.forumgratuit.org" target="_blank"><img src="http://nsa27.casimages.com/img/2011/07/16/110716100821717052.jpg"></a>
<a href="http://lifehouse-fan.kazeo.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t12.jpg"></a>
<a href="http://lifehouse-fan.forum-canada.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t13.jpg"></a>
</marquee></p></div>
La C.S.S:
- Code:
/*Le bloc complet sans les partenaires*/
#M14_tout
{
width:100%;
height:420px;
background: #1a1a1a;
-webkit-border-radius: 6px;
border-radius: 6px;
}
/*Tableau à gauche*/
.M14_tab1 {float:left;margin-left:10px;width:150px; }
/*Tableau du centre*/
.M14_tab2 {position:absolute;margin-left:190px; width:150px; }
/*Tableau à droite*/
.M14_tab3 {float:right;margin-right:10px;width:150px; height: 150px; }
/*Couleur du texte qui défile */
.annonce_defil {color:#ffffff;font-size:12px;}
/*Couleur du lien qui défile */
.annonce_defil a {color:#20aec8;font-size:12px;}
/*Couleur du lien au survol qui défile */
.annonce_defil a:hover {color:#E24911;font-size:12px;}
/*Espace entre l image et le texte */
.annonce_defil img {margin-right:5px;}
/*L image en dessous du tableau 2 */
.M14_image
{
padding-top:5px;
padding-left:30px;
}
/*Bordures arrondies de l image en dessous du tableau 2*/
.M14_image img { -webkit-border-radius: 6px;border-radius: 6px; }
/* effet de transparence image */
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.transparence2 {
margin: 3px;
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence2:hover{
background-color: transparent;
border: none;
opacity: 2;
}
/*Titre du tableau 1 */
.titre1
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align:center;
}
/*Titre du tableau 2*/
.titre2
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
margin-left:65px;
}
/*Titre du tableau 3*/
.titre3
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align:center;
}
.html-marquee2 {height:31px;}
.partenaires {
background-color: #0E0E0E;
background-image: url(http://img15.hostingpics.net/pics/874614Partenaires.png);
background-position: left center;
background-repeat: no-repeat;
padding: 1px 10px 1px 250px;
width: 400px;
}
.partenaires p {
-webkit-border-radius: 20px;
background-color: #0E0E0E;
border-bottom: 3px solid #0E0E0E;
border-left: 3px solid #0E0E0E;
border-radius: 20px;
border-right: 3px solid #0E0E0E;
height: 31px;
padding: 6px;
}
.partenaires img {
box-shadow: 0px 0px 4px #999; }
.boite1 {
background-color: #0E0E0E;
padding: 14px;
border-radius: 30px;
-moz-border-radius: 30px;
-webkit-border-radius: 30px;
}
.boite2
{
background-color: #0E0E0E;/*couleur de fond*/
height:200px;
overflow:auto;
width: 300px;
padding: 15px 10px 15 px 10px;
color:#ffffff;
font-size:10px;
border-radius: 30px; /*les bordures arrondies pour tout les navigateurs*/
-webkit-border-radius: 30px; /*les bordures arrondies pour google chrome*/
}
Voilà, espérant t'avoir aidé .
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
Super merci c'est exactement ce que je voulais.
Il reste encore une mini chose à ajouter ^^ l'écriture de la boite 2 pourrait-elle être de la même taille que la boite 3 ? Quand on lis ça fait pas mal petit.
Après ça je crois que ce sera parfait
Il reste encore une mini chose à ajouter ^^ l'écriture de la boite 2 pourrait-elle être de la même taille que la boite 3 ? Quand on lis ça fait pas mal petit.
Après ça je crois que ce sera parfait
Re: Page d'accueuil petite modif d'un code
Salut Gabee,
j'ai modifié le code HTML et la feuille de style,
il faudra donc supprimer les deux parties .
J' ai aussi attribué une class pour la boite 2,
si tu as besoin de changer la police ce sera donc ici:
Supprimes donc ton code HTML et remplace par celui-ci:
Supprimes le contenu dans ta feuille de style qui correspond à ton tableau et remplace par ceci:
Penses bien à valider les modifications en cliquant sur le bouton "Valider".
a++
j'ai modifié le code HTML et la feuille de style,
il faudra donc supprimer les deux parties .
J' ai aussi attribué une class pour la boite 2,
si tu as besoin de changer la police ce sera donc ici:
- Code:
.boite2
font-size:12px;
Supprimes donc ton code HTML et remplace par celui-ci:
- Code:
<div id="M14_tout">
<div class="M14_tab1"><div class="titre1">Le staff</div><br><div class="boite1">
<img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t14.jpg" class="transparence"><br><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t16.jpg" class="transparence"><img src="URL DE L'IMAGE" class="transparence"><img src="http://i49.servimg.com/u/f49/14/89/95/82/no_new15.png" class="transparence">
</div>
</div><div class="M14_tab2"><div class="titre2">Bienvenue sur ROTN</div><br><div class="boite2">
Tu viens d'arriver dans le monde le plus cruel qui soit avec des créatures dont tu ignorais l'existence avant. Les vampires se sont dévoilés au grand jour inspirant la panique général chez les humains. Les elfes,eux,n'avaient rien à s'inquiéter,car ils bénéficient d'une infaillible protection. Les rois et reines se sont mis d'accord,chacun devraient rester sur son territoire sinon il y aurait des problèmes.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
Ensuite tu as avec toi des anges et des démons dont tous ignorent leur race. Une guerre menace d'éclater dans ce beau ciel bleu qui risque d'être souillé de sang tout comme le sol. Pour couronner le tout,une autre guerre risque d'apparaître entre les elfes et les humains contre les vampires. La tristesse,la joie,le bonheur comme le malheur sont au rendez-vous.
<img src="http://i31.servimg.com/u/f31/16/91/07/21/61345012.png" border="0" alt="" />
<br>
Tu as une histoire,un passé,un présent et un futur.
Que feras-tu quand tu mettras les pieds dans ce monde où la guerre le menace ?<br><br>
</div><div class="M14_image"><img src="http://www.servimg.com/u/f31/16/91/07/21/sans_t10.jpg" border="0" alt="" />
</div>
</div><div class="M14_tab3">
<div class="titre3">Annonces</div><br><div class="boite3">
<span class="annonce_defil"><marquee behavior="scroll" direction="down" scrollamount="1" height="250">
<center>
~ Annonce 1<br>
~ Annonce 2<br>
~ Annonce 3<br>
~ Annonce 4<br>
~ Annonce 5<br>
~ Annonce 6<br>
<img src="http://r24.imgfast.net/users/2913/10/00/00/smiles/2674625213.png"align="absmiddle"><a href="http://www.google.fr/"title="Moteur de recherches, Google est là pour vous.">Une recherche!!!</a><br>
</marquee></center></span>
</div>
</div>
</div>
<div class="partenaires"><p><marquee class="html-marquee2" direction="left" scrollamount="3" onmouseover=this.stop(); onmouseout=this.start();>
<a href="http://www.clanofthemoon.forumgratuit.org" target="_blank"><img src="http://nsa27.casimages.com/img/2011/07/16/110716100821717052.jpg"></a>
<a href="http://lifehouse-fan.kazeo.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t12.jpg"></a>
<a href="http://lifehouse-fan.forum-canada.com/" target="_blank"><img src="http://i31.servimg.com/u/f31/16/91/07/21/sans_t13.jpg"></a>
</marquee></p></div>
Supprimes le contenu dans ta feuille de style qui correspond à ton tableau et remplace par ceci:
- Code:
/*Le bloc complet sans les partenaires*/
#M14_tout
{
width:100%;
height:420px;
background: #1a1a1a;
-webkit-border-radius: 6px;
border-radius: 6px;
}
/*Tableau à gauche*/
.M14_tab1 {float:left;margin-left:10px;width:150px; }
/*Tableau du centre*/
.M14_tab2 {position:absolute;margin-left:190px; width:150px; }
/*Tableau à droite*/
.M14_tab3 {float:right;margin-right:10px;width:150px; height: 150px; }
/*Couleur du texte qui défile */
.annonce_defil {color:#ffffff;font-size:12px;}
/*Couleur du lien qui défile */
.annonce_defil a {color:#20aec8;font-size:12px;}
/*Couleur du lien au survol qui défile */
.annonce_defil a:hover {color:#E24911;font-size:12px;}
/*Espace entre l image et le texte */
.annonce_defil img {margin-right:5px;}
/*L image en dessous du tableau 2 */
.M14_image
{
padding-top:5px;
padding-left:30px;
}
/*Bordures arrondies de l image en dessous du tableau 2*/
.M14_image img { -webkit-border-radius: 6px;border-radius: 6px; }
/* effet de transparence image */
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
.transparence2 {
margin: 3px;
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence2:hover{
background-color: transparent;
border: none;
opacity: 2;
}
/*Titre du tableau 1 */
.titre1
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align:center;
}
/*Titre du tableau 2*/
.titre2
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
margin-left:65px;
}
/*Titre du tableau 3*/
.titre3
{
position:relative;
margin-top:15px;
width:150px;
color: #8F3D3D;
font-family: georgia;
text-shadow: 0px 0px 4px red;
font-size: 20px;
letter-spacing: -2px;
text-transform: lowercase;
text-align:center;
}
.html-marquee2 {height:31px;}
.partenaires {
background-color: #0E0E0E;
background-image: url(http://img15.hostingpics.net/pics/874614Partenaires.png);
background-position: left center;
background-repeat: no-repeat;
padding: 1px 10px 1px 250px;
width: 400px;
}
.partenaires p {
-webkit-border-radius: 20px;
background-color: #0E0E0E;
border-bottom: 3px solid #0E0E0E;
border-left: 3px solid #0E0E0E;
border-radius: 20px;
border-right: 3px solid #0E0E0E;
height: 31px;
padding: 6px;
}
.partenaires img {
box-shadow: 0px 0px 4px #999; }
.boite1 {
background-color: #0E0E0E;
padding: 14px;
border-radius: 30px;
-webkit-border-radius: 30px;
}
.boite2
{
background-color: #0E0E0E;/*couleur de fond*/
height:200px;
overflow:auto;
width: 300px;
padding: 15px 10px 15 px 10px;
color:#ffffff;
font-size:12px;
border-radius: 30px; /*les bordures arrondies pour tout les navigateurs*/
-webkit-border-radius: 30px; /*les bordures arrondies pour google chrome*/
}
.boite3
{
background-color: #0E0E0E;
padding: 14px;
border-radius: 30px;
-webkit-border-radius: 30px;
}
Penses bien à valider les modifications en cliquant sur le bouton "Valider".
a++
Invité- Invité
Re: Page d'accueuil petite modif d'un code
C'est parfait ! J'ai plus rien à dire (une chance xD) ^-^.
Merci beaucoup !!!
Merci beaucoup !!!
Forum gratuit : Le forum des forums actifs :: Entraide & Support... :: Gérer l'apparence de son forum :: Archives des problèmes avec l'apparence du forum
Page 1 sur 1
Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum