Page d'accueuil petite modif d'un code

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Page d'accueuil petite modif d'un code

Message par Gabee Mar 4 Sep 2012 - 0:01

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 :
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
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Mar 4 Sep 2012 - 4:05

Salut Gabee,

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 Wink .

Bonne journée.
a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Dim 9 Sep 2012 - 1:13

OK ça marche,ce que je voulais qui disparaisse à disparut,mais maintenant j'ai l'image en plein milieu de la boîte 2


Page d'accueuil petite modif d'un code  Captur14

et en rouge c'est l'endroit où elle doit être.
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Dim 9 Sep 2012 - 6:14

Salut Gabee ,
j'ai modifié tout ton tableau ainsi que la feuille de style,
le résultat est identique Wink .

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">
Le premier tableau:
Code:
 <div class="M14_tab1">
Le deuxième tableau:
Code:
 <div class="M14_tab2">
Le troisième tableau:
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 Wink .


Le code html:
Spoiler:

La C.S.S:
Spoiler:


a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Lun 10 Sep 2012 - 2:12


Salut =)
Encore un mini problème ^^''
L'image est maintenant à sa place,mais là c'est la boite du milieu (la 2 je crois) qui va sur la boite à côté (la 3) comme ça :

Page d'accueuil petite modif d'un code  Captur15

je sais pas comment remettre la boite 2 à sa place ^^

avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Lun 10 Sep 2012 - 6:43

Salut Gabee,

on a pas la même largeur sur la P.A Wink .

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 Wink .
a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Lun 10 Sep 2012 - 13:28

Je préfère garder ma largeur de page actuelle (40%)
alors on revoit le code s'il te plaît ^^''
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Mar 11 Sep 2012 - 6:03

Salut Gabee,

alors on revoit le code s'il te plaît ^^''

je te tiens informé dans la semaine Wink .

a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Mar 11 Sep 2012 - 12:42

D'accord merci =)
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Mer 12 Sep 2012 - 7:31

Salut Gabee,

bon , c'est plus tôt que prévu Very Happy .
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é Wink .

a++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Lun 17 Sep 2012 - 2:50

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 Smile
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Invité Lun 17 Sep 2012 - 5:55

Salut Gabee,

j'ai modifié le code HTML et la feuille de style,
il faudra donc supprimer les deux parties Wink .
J' ai aussi attribué une class pour la boite 2,
si tu as besoin de changer la police ce sera donc ici:
Code:
.boite2
La valeur 12 px sera a changer Wink
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++
Anonymous

Invité
Invité


Invité a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Page d'accueuil petite modif d'un code

Message par Gabee Mer 26 Sep 2012 - 0:02

C'est parfait ! J'ai plus rien à dire (une chance xD) ^-^.

Merci beaucoup !!!
avatar

Gabee
Nouveau membre

Messages : 17
Inscrit(e) le : 29/07/2012

http://regionofthenight.forum-canada.com
Gabee a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut


Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum