Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Les Page d'acceuil Sam 3 Sep - 20:04 | |
| PA CLASSIQUES: - Code:
-
<center> <br>
<TABLE border="0"> <td> <div style="opacity: 0.8; background-color: #bed9b4; height: 25px; width: 280px; "><span style="font-size: 20px; line-height: normal; color: #000000; font-family: Candara; text-shadow: 1px 1px 2px rgb(40, 40, 40);"><center>L'EQUIPE DE CHOC</center></span></div> <br><br> <div style="opacity: 0.8; background-color: #bed9b4; height: 190px; width: 260px; border : 10px solid #bed9b4;"><center><table border="0"><td><!-- CODE DU LIEN - VOUS POUVEZ EN PLACER PLUSIEURS SUR VOTRE PAGE --> <A HREF="http://poudlard-entre-temps.forumgratuit.org/u1" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Isabella Garland <br/> <strong>Rang : </strong> Fondatrice<br/> <strong>Inscription : </strong> 22/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i29.servimg.com/u/f29/11/29/31/76/keira-10.jpg" class="transparence"></A>
<A HREF="http://poudlard-entre-temps.forumgratuit.org/u5" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Elisabelle Valterri <br/> <strong>Rang : </strong> Administratrice<br/> <strong>Inscription : </strong> 24/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/elisab10.gif" class="transparence"></A>
<A HREF="http://poudlard-entre-temps.forumgratuit.org/u4" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Choixpeau Magique <br/> <strong>Rang : </strong> Administrateur<br/> <strong>Inscription : </strong> 24/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/choixp10.gif" class="transparence"></A>
<A HREF="http://destin-magique.forumactif.com/u135" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Gabrielle McLean <br/> <strong>Rang : </strong> Administratrice<br/> <strong>Inscription : </strong> 23/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/gab10.gif" class="transparence"></A> <font color="black"><center><br><b>Fondatrice :</b> Isabella Garland <br><b>Co admin :</b> Elisabelle Valterri <br><b>Co admin :</b> Choixpeau Magique <br><b>Co admin :</b> Gabrielle McLean</center></font>
<!-- CODE DU BLOC QUI VA AFFICHER LE TEXTE QUAND LE LIEN SERA SURVOLE PAR LA SOURIS NE COPIER CE CODE QU'UNE FOIS DANS LA PAGE --><DIV ID=ejs_texte></DIV>
</div> </div> </div></td></table></div> </td>
<td><div style="opacity: 0.8; background-color: #bed9b4; height: 25px; width: 230px; "><span style="font-size: 20px; line-height: normal; color: #000000; font-family: Candara; text-shadow: 1px 1px 2px rgb(40, 40, 40);"><center>SYNOPSIS</center></span></div> <br><br><div style="opacity: 0.8; background-color: #bed9b4; height: 200px; width: 220px; border : 5px solid #bed9b4;"><div text-align:center; margin-bottom:14px"><div style="width: 220px ;height: 180px;overflow: auto"><div style="font-family: tahoma;"><span style="font-size: 13px; line-height: normal"><center><font color="black"></font> </center></div> </div></span> </td>
<td> <div style="opacity: 0.8; background-color: #bed9b4; height: 25px; width: 280px; "><span style="font-size: 20px; line-height: normal; color: #000000; font-family: Candara; text-shadow: 1px 1px 2px rgb(40, 40, 40);"><center>L'EQUIPE DE CHOC</center></span></div> <br><br> <div style="opacity: 0.8; background-color: #bed9b4; height: 190px; width: 260px; border : 10px solid #bed9b4;"><center><table border="0"><td><!-- CODE DU LIEN - VOUS POUVEZ EN PLACER PLUSIEURS SUR VOTRE PAGE --> <A HREF="http://poudlard-entre-temps.forumgratuit.org/u1" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Isabella Garland <br/> <strong>Rang : </strong> Fondatrice<br/> <strong>Inscription : </strong> 22/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i29.servimg.com/u/f29/11/29/31/76/keira-10.jpg" class="transparence"></A>
<A HREF="http://poudlard-entre-temps.forumgratuit.org/u5" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Elisabelle Valterri <br/> <strong>Rang : </strong> Administratrice<br/> <strong>Inscription : </strong> 24/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/elisab10.gif" class="transparence"></A>
<A HREF="http://poudlard-entre-temps.forumgratuit.org/u4" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Choixpeau Magique <br/> <strong>Rang : </strong> Administrateur<br/> <strong>Inscription : </strong> 24/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/choixp10.gif" class="transparence"></A>
<A HREF="http://destin-magique.forumactif.com/u135" onmouseover="ChangeMessage('<strong>Pseudos : </strong> Gabrielle McLean <br/> <strong>Rang : </strong> Administratrice<br/> <strong>Inscription : </strong> 23/07/2011<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i45.servimg.com/u/f45/11/95/28/31/gab10.gif" class="transparence"></A> <font color="black"><center><br><b>Fondatrice :</b> Isabella Garland <br><b>Co admin :</b> Elisabelle Valterri <br><b>Co admin :</b> Choixpeau Magique <br><b>Co admin :</b> Gabrielle McLean</center></font>
<!-- CODE DU BLOC QUI VA AFFICHER LE TEXTE QUAND LE LIEN SERA SURVOLE PAR LA SOURIS NE COPIER CE CODE QU'UNE FOIS DANS LA PAGE --><DIV ID=ejs_texte></DIV>
</div> </div> </div></td></table></div> </td>
</table>
<TABLE border="0"> <td><td><div style="opacity: 0.8; background-color: #bed9b4; height: 25px;"><span style="font-size: 20px; line-height: normal; color: #000000; font-family: Candara; text-shadow: 1px 1px 2px rgb(40, 40, 40);"><center>NOS PARTENAIRES</center></span></div> <br><br><div style="opacity: 0.8; background-color: #bed9b4; height: 150px; width: 220px; border : 5px solid #bed9b4;"> <marquee style="width: 216px; height: 120px;" direction="up" scrollamount="1" onmouseover="this.stop();" onmouseout="this.start();"><A HREF="" ><img src="" class="transparence"></a>
<A HREF="" ><img src="" class="transparence"></a>
<br><A HREF="" ><img src="" class="transparence"></a></marquee></span>
</div> </td><br> <td><div style="opacity: 0.8; background-color: #bed9b4; height: 25px;"><span style="font-size: 20px; line-height: normal; color: #000000; font-family: Candara; text-shadow: 1px 1px 2px rgb(40, 40, 40);"><center>NOS TOP SITE</center></span></div> <br><br><div style="opacity: 0.8; background-color: #bed9b4; height: 150px; width: 220px; border : 5px solid #bed9b4;"> <marquee style="width: 216px; height: 120px;" direction="up" scrollamount="1" onmouseover="this.stop();" onmouseout="this.start();"></marquee></span> </div> </td></br></td>
</table> LE CSS: - Code:
-
.forumline { border:1px dashed #274454; }
.quote, .code { border: 1px solid #ffffff; }
a {font-size: 11px; }
a:hover { font-size: 12px; }
/*Credits: CSS débutant */ /*URL: http://harry-next-RPG.forumactif.com */ a { /* Les liens ne seront plus soulignés */ text-decoration: none; }
body.chatbox {background-image:url(http://d19.e-loader.net/6JKG8djs8O.jpg);} .chatbox_row_1,.chatbox_row_2,.chatbox_row_3 {background: none;} | |
|
Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Re: Les Page d'acceuil Sam 3 Sep - 20:24 | |
| PA N°1 - Code:
-
<br><div style="margin: auto; text-align: center; width: 700px;"> </div><div style="text-align: center; width: 700px;"> <a href="http://" class="navigation"><b>Règlement</b></a>
<a href="http://" class="navigation"><b>Postes Vacants</b></a>
<a href="http://" class="navigation"><b>Guide</b></a>
<a href="http://" class="navigation"><b>Partenariat</b></a>
<a href="http://" class="navigation"><b>Section Invités</b></a> </div> <table style="margin: auto; text-align: center; width: 700px;"> <tbody><tr> <td width="50%"> <span class="titre"> News </span><br> <div style="overflow: auto; width: 100%; height: 80px;"> <div style="margin: auto; text-align: left; width: 100%;"> </div> <font size="1"> <ul> <div align="left"> - Blablabla<br> - Blablabla<br> - Blablabla<br> - Blablabla<br> - Blablabla<br> - Blablabla<br> - Blablabla<br> </div> </ul> </font> </div> <table> <tbody><tr align="left"> <td><br><br> <span class="titre"> Contexte </span> <br><div style="overflow: auto; width: 100%; height: 80px;"> <div style="margin: auto; text-align: left; width: 100%;"> </div> <i style="text-align: justify;"><span style="font-size: 11px; line-height: normal;">Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici. Votre contexte ici.</span></i></div><br><br> </td> </tr> </tbody></table> </td>
<td class="droite" width="50%"> <br> <table align="right"> <tbody> <tr height="150"> <td> <span style="font-size: 12px;"> <div style="margin: auto; width: 100%;"> </div> <br> <center><FORM><SELECT style="font-family: arial; color: white; border: 1px dotted black;-moz-border-radius:8px; font-size: 12; padding:3px; background-color: #8A8A8A;" onchange="location = this.options [this.selectedIndex].value"> <OPTION selected >Top Partenaires</OPTION> <OPTION value=http://>Ami 1</OPTION> <OPTION value=http://>Ami 2</OPTION> <OPTION value=http://>Ami 3</OPTION> <OPTION value=http://>Ami 4</OPTION> <OPTION value=http://>Ami 5</OPTION> <OPTION value=http://>Ami 4</OPTION> <OPTION value=http://>Ami 6</OPTION> </SELECT> </FORM></center> <br><br><br> </span> </td> </tr> <tr> <td> <span class="titre"> Staff </span> <br> <center><a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> <a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> <a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> </center> <br> <br> <br> </td> </tr> </tbody></table> </td> </tr> </tbody></table><div style="margin: auto; text-align: center; width: 700px;"> </div><div style="text-align: right;">Page d'Accueil by <a href="http://pole-emploi-hp.forumotion.com/">Roxy</a></div> Le CSS - Code:
-
/*Page d'Accueil*/
.navigation {background-color: #8A8A8A; text-align: center; width: 120px; height: 15px; border: 1px black dotted; -border-radius: 10px; -moz-border-radius:10px; -webkit-border-radius:10px; -khtml-border-radius:10px; text-color:#000000; text-decoration: none; cursor:pointer; display:inline-block; margin-left:3px; margin-right:3px; padding: 3px; }
.titre{ display:block; border-bottom:4px #8A8A8A solid; padding-bottom:10px; font-weight:bold; font-size:18px; text-align:center; }
* a.info { position: relative; color: white; text-decoration: none; }
a.info span { display: none; /* on masque l'infobulle */ } a.info:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: help; /* on change le curseur par défaut en curseur d'aide */ } a.info:hover span { display: inline; /* on affiche l'infobulle */ position: absolute;
white-space: normal;
top: 20px; left: 10px;
background-color: #8A8A8A;
-moz-border-radius : 5px 5px 5px 5px; padding: 3px;
border: 1px dashed white; width: 150px;}
Dernière édition par Admin le Sam 3 Sep - 21:03, édité 1 fois | |
|
Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Re: Les Page d'acceuil Sam 3 Sep - 20:25 | |
| PA N°2 - Code:
-
<SPAN class=genmed> <TABLE class="forumline table1 bg3" cellSpacing=1 width="100%"> <TBODY> <TR> <TH class="thTop forabg" width="28%">Postes Vacants<BR></TH> <TH class="thTop forabg" width="43%"><DIV align=center>Contexte</DIV></TH> <TH class="thTop forabg" width="29%">Nos Partenaires</TH></TR><SPAN class=postbody></SPAN> <TR> <TD class=row3 align=middle><DIV align=center><SPAN class=postbody> <center><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div></center></SPAN></DIV></TD> <TD class=row3 align=middle><DIV align=center><SPAN class=postbody><p>Votre contexte ici</p></SPAN></DIV></TD> <TD class=row3 align=middle><SPAN class=postbody> <CENTER> <A href="http://"><IMG src="http://img10.hostingpics.net/pics/956658Partenaires.png"></A><br><br> <A href="http://"><IMG src="http://img10.hostingpics.net/pics/956658Partenaires.png"></A><br><br> <A href="http://"><IMG src="http://img10.hostingpics.net/pics/956658Partenaires.png"></A></CENTER></SPAN></TD> <TR><SPAN class=genmed></TR></TBODY></TABLE> <TABLE class="forumline table1 bg3" cellSpacing=1 width="100%"> <TBODY> <TR> <TH class="thTop forabg" width="28%">News<BR></TH> <TH class="thTop forabg" width="43%">Liens Rapides</TH> <TH class="thTop forabg" width="29%">Crédits</TH></TR> <TR> <TD class=row3 align=middle><DIV align=center><SPAN class=postbody><marquee style="font-weight:bold; color:#000000; height:100px; width:250px; text-align:center" direction="up" scrollamount="2"> * News 1<br> * News 2<br> * News 3<br> * News 4</marquee></SPAN></DIV></TD> <TD class=row3 align=middle><DIV align=center> <FORM><SELECT style="WIDTH: 268px" onchange="location = this.options [this.selectedIndex].value"> <OPTION selected value=http://>Menu 1</OPTION> <OPTION value=http://>Menu 2</OPTION> <OPTION value=http://>Menu 3</OPTION> <OPTION value=http://>Menu 4</OPTION> <OPTION value=http://>Menu 5</OPTION> </SELECT> </FORM></DIV></TD> <TD class=row3 align=middle> <p><SPAN class=postbody><div style="text-align: center;"><FONT size=2>Page d'Accueil by <a href="http://pole-emploi-hp.forumotion.com/">Roxy</a></FONT></div></SPAN></p></TD></TR></TBODY></TABLE></SPAN></SPAN>
Dernière édition par Admin le Sam 3 Sep - 21:04, édité 1 fois | |
|
Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Re: Les Page d'acceuil Sam 3 Sep - 20:27 | |
| PA N°3 - Code:
-
<br><div style="margin: auto; text-align: center; width: 700px;"> </div><div style="text-align: center; width: 700px;"> <a href="http://" class="navigation"><b>Règlement</b></a>
<a href="http://" class="navigation"><b>Contexte</b></a>
<a href="http://" class="navigation"><b>Présentation</b></a>
<a href="http://" class="navigation"><b>Avatars</b></a> </div> <br><table style="margin: auto; text-align: center; width: 700px;"> <tbody><tr> <td width="30%"><br><br><br> <span class="titre"> Les Postes Vacants </span> <center><marquee onmouseover="this.stop()" ;="" padding:="" margin-left:="" 0px;="" width:="" 200px;="" height:="" 120px;="" onmouseout="this.start()" scrollamount="1" scrolldelay="1" direction="up"><center><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div> </center></marquee><table><tbody><tr></tr></tbody></table></center><br><br>
</td><td width="35%"> <br> <table> <tbody><tr> <td> <span class="titre"> Le Contexte </span> <br> <div style="overflow: auto; width: 100%; height: 100px;"> <div style="margin: auto; text-align: left; width: 100%;"> </div> <font size="1"> </font><ul> <font size="1"> </font><div align="justify"><font size="1">Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla <br></font></div><font size="1"><br><br> </font></ul></div></td> </tr> </tbody></table> </td><td width="30%"> <br> <table> <tbody><tr> <td> <span class="titre"> Le Staff </span> <br> <center><a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> <a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> <br> <a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> </center></td></tr></tbody></table><br> <br> <br> </td> </tr> </tbody></table>
<br><table style="margin: auto; text-align: center; width: 700px;"> <tbody><tr> <td width="50%"> <span class="titre"> Informations et Crédits </span><br><br><br> <center><center>Toute reproduction totale ou partielle du Forum est interdite.<br><br>
Page d'accueil par <a href="http://pole-emploi-hp.forumotion.com/">Roxy</a>.<br><br>
Ouverture du Forum le ...</center><table><tbody><tr></tr></tbody></table></center><br><br>
</td><td class="droite" width="50%"> <br> <table align="right"> <tbody><tr> <td> <span class="titre"> Les Partenaires </span> <br> <center><marquee onmouseover="this.stop()" ;="" padding:="" margin-left:="" 0px;="" width:="" 200px;="" height:="" 120px;="" onmouseout="this.start()" scrollamount="1" scrolldelay="1" direction="left"><center> <center> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a></center></center></marquee><table><tbody><tr></tr></tbody></table></center><br><br></td></tr></tbody></table><br> <br> <br> <br> </td> </tr> </tbody></table> LE CSS - Code:
-
/*PA*/
.navigation{ list-style-type: none; text-align: center; display: inline; text-align: center; margin: 0 15px 0 0; padding: 3px 8px 3px 8px; text-decoration: none; color: #93a3a4; background-color: #000000; border: 1px dotted #000000; } .navigation:hover{ background-color: #000000; color: #DBDBDB; }
.titre{ display:block; border-bottom:4px double #000000; padding-bottom:10px; font-weight:bold; font-size:14px; text-align:center; }
* a.info { position: relative; color: white; text-decoration: none; }
a.info span { display: none; /* on masque l'infobulle */
} a.info:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: help; /* on change le curseur par défaut en curseur d'aide */ } a.info:hover span { display: inline; /* on affiche l'infobulle */ position: absolute;
white-space: normal
top: 50px; left: 50px;
background-color: #000000;
color: #93a3a4; padding: 3px;
border: 1px solid #93a3a4; width: 150px;}
Dernière édition par Admin le Sam 3 Sep - 21:04, édité 1 fois | |
|
Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Re: Les Page d'acceuil Sam 3 Sep - 20:29 | |
| PA N°4 - Code:
-
<br><div style="margin: auto; text-align: center; width: 700px;"> </div><div style="text-align: center; width: 700px;"> <a href="http://" class="navigation"><b>Règlement</b></a>
<a href="http://" class="navigation"><b>Contexte</b></a>
<a href="http://" class="navigation"><b>Présentation</b></a>
<a href="http://" class="navigation"><b>Avatars</b></a> </div> <br> <table> <tr> <td> <table> <tr> <td id="desc"><p style="text-align:center;font-size:14px;"><div style="margin: auto; text-align: center; width: 60%;"> </div><span class="titre"> Le Contexte </span></div> <br> <div style="overflow: auto; width: 90%; height: 100px;"> <div style="margin: auto; text-align: left; width: 100%;"> </div> <font size="1"> </font><ul> <font size="1"> </font><div align="justify"><font size="1">Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla Blablabla Blablabla Blabla Blablabla Blabla <br></font></div><font size="1"><br><br> </font></ul></div></td> <td> <td></div></div><br><br> <div id="staff"><td class="droite" width="35%"><span class="titre"> Les Postes Vacants </span> <center><marquee onmouseover="this.stop()" ;="" padding:="" margin-left:="" 0px;="" width:="" 200px;="" height:=""60px;="" onmouseout="this.start()" scrollamount="1" scrolldelay="1" direction="up"><center><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div><div style=""> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"></a></div> </center></marquee></td></tr></table></a> </div> </td> </tr> </table> <table><br><br> <tr> <td id="anim"><table style="margin: auto; text-align: center; width: 60%;"><span class="titre"> Le Staff </span> <br> <center><a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a> <a class="info"><img src="http://img10.hostingpics.net/pics/143262IconePA.png"><span><center>Prénom Nom<br>Rang sur le Forum</center></table></td> <td id="partenaire"><td class="droite" width="50%"><span class="titre"> Les Partenaires </span> <br> <center><marquee onmouseover="this.stop()" ;="" padding:="" margin-left:="" 0px;="" width:="" 200px;="" height:="" 40px;="" onmouseout="this.start()" scrollamount="1" scrolldelay="1" direction="left"><center> <center> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a> <a href="http://"><img src="http://img10.hostingpics.net/pics/956658Partenaires.png"></a></center></center></marquee><br><br>( <a href="http://">Les Autres</a> ) - ( <a href="http://">Vous ?</a> )</p></td> <td><div id="credits"><span class="titre"> Informations et Crédits </span><br><br><br> <center><center>Toute reproduction totale ou partielle du Forum est interdite.<br><br>
Page d'Accueil par <a href="http://pole-emploi-hp.forumotion.com/">Roxy</a>.<br><br>
Ouverture du Forum le ...</center></div><hr /></td></tr></table></td></tr></table></div> LE CSS - Code:
-
/*PA*/
.navigation{ list-style-type: none; text-align: center; display: inline; text-align: center; margin: 0 15px 0 0; padding: 3px 8px 3px 8px; text-decoration: none; color: #93a3a4; background-color: #000000; border: 1px dotted #000000; } .navigation:hover{ background-color: #000000; color: #DBDBDB; }
.titre{ display:block; border-bottom:4px double #000000; padding-bottom:10px; font-weight:bold; font-size:14px; text-align:center; }
* a.info { position: relative; color: white; text-decoration: none; }
a.info span { display: none; /* on masque l'infobulle */
} a.info:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: help; /* on change le curseur par défaut en curseur d'aide */ } a.info:hover span { display: inline; /* on affiche l'infobulle */ position: absolute;
white-space: normal
top: 50px; left: 50px;
background-color: #000000;
color: #93a3a4; padding: 3px;
border: 1px solid #93a3a4; width: 150px;}
Dernière édition par Admin le Sam 3 Sep - 21:05, édité 1 fois | |
|
Admin Admin
Messages : 125 Date d'inscription : 24/03/2010
| Sujet: Re: Les Page d'acceuil Sam 3 Sep - 20:38 | |
| PA N°5 - Code:
-
<!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"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Un système d'onglet en javascript</title> <script type="text/javascript"> //<!-- function change_onglet(name) { document.getElementById('onglet_'+anc_onglet).className = 'onglet_0 onglet'; document.getElementById('onglet_'+name).className = 'onglet_1 onglet'; document.getElementById('contenu_onglet_'+anc_onglet).style.display = 'none'; document.getElementById('contenu_onglet_'+name).style.display = 'block'; anc_onglet = name; } //--> </script> </head> <body> <div class="systeme_onglets"> <div class="onglets"> <span class="onglet_0 onglet" id="onglet_quoi" onclick="javascript:change_onglet('quoi');">Accueil</span> <span class="onglet_0 onglet" id="onglet_qui" onclick="javascript:change_onglet('qui');">Postes Vacants</span> <span class="onglet_0 onglet" id="onglet_chose" onclick="javascript:change_onglet('chose');">Staff et Crédits</span> </div> <div class="contenu_onglets"> <div class="contenu_onglet" id="contenu_onglet_quoi"> <br> <br><div style="margin: auto; text-align: center; width: 700px;"> </div><div style="text-align: center; width: 800px;"> <table width="800px" cellpadding="0" cellspacing="0"><tr><td><h1><a href="http://" class="navigation"><font face="Georgia"><b>Règlement</b></font></a></h1></td>
<td><h1><a href="http://" class="navigation"><font face="Georgia"><b>Présentation</b></font></a></h1></td>
<td><h1><a href="http://" class="navigation"><font face="Georgia"><b>Avatars</b></font></a></h1></td></tr></table>
</div> <br><br> Nous demandons ... lignes minimum.<br><br><br><br><table width="800px" cellpadding="0" cellspacing="0"> <tr><td id="colonne gauche" class="titre"><h1>Contexte</h1><br><div style="width:350px;height:150px;overflow:auto;"><p><strong>I</strong>ci sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte. Ici sera inscrit le contexte.</p></div></td><td id="colonne droite" class="titre"><h1>News du Forum</h1><p>Le forum a ouvert ses portes le ...</p><p>Autre News</p></td></tr></table><br> </font> </div> </div> <div class="contenu_onglet" id="contenu_onglet_qui"> <br><table><tr><td><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div></td><td><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div></td><td><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div></td><td><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div></td></tr></table><br>
<h1><a href="http://" class="navigation"><b>Voir tous les Postes Vacants</b></a></h1></div> </div> <div class="contenu_onglet" id="contenu_onglet_chose"> <br><table width="800px" cellpadding="0" cellspacing="0"> <br><h1>Staff et Crédits</h1><br><tr><td><div style="text-align: center;"><p>Toute reproduction totale ou partielle du Forum est interdite.<br><br><br>Page d'Accueil par <a href="http://fofolies.forumotion.com/forum.htm">Roxy</a></p></div><br></td><td><a class="info"><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a></td><td><a class="info"><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a></td><td><a class="info"><div style="border: 4px solid white; padding: 10px; width: 80px; height: 80px;-moz-border-radius: 100px; background-image: url(http://img4.hostingpics.net/pics/668851Icone.png);"></div><span><center>Prénom Nom<br>Rang sur le Forum</center></span></a></td></tr></table></div> <script type="text/javascript"> //<!-- var anc_onglet = 'quoi'; change_onglet(anc_onglet); //--> </script> </body> </html> LE CSS - Code:
-
/*Page d'Accueil*/ .navigation{ list-style-type: none; text-align: center; display: inline; margin: 0 15px 0 0; padding: 3px 8px 3px 8px; color: #AE8C76; text-decoration: none; font-size:20px; } .navigation:hover{ color: #AE8C76; }
.onglet { display:inline-block; margin-left:3px; margin-right:3px; padding: 3px; -moz-border-radius:5px; -webkit-border-radius:5px; -khtml-border-radius:5px; border: 2px solid black; background-color: white ; color: #663F25; cursor:pointer; } .onglet_0 { background: white; border-bottom:2px solid black; } .onglet_1 { background:#D9D6CE; border-bottom:0px solid black; padding-bottom:4px; } .contenu_onglet { background-image: url("http://img4.hostingpics.net/pics/778266FondPApng.png"); border: 2px solid black; -moz-border-radius : 5px; margin-top:-1px; padding:5px; display:none; color:#D9D6CE; } ul { margin-top:0px; margin-bottom:0px; margin-left:-10px; } h1 { margin:0px; padding:0px; } h1{ propriété; background-image: url("http://i1016.photobucket.com/albums/af284/emelyc/grossf5.jpg"); -moz-border-radius: 15px; -webkit-border-radius: 15px; -border-radius: 15px; -khtml-border-radius:15px; border: 2px solid black; text-align: center; margin: 0 15px 0 0; padding: 3px 8px 3px 8px; color: black; font-weight:bold; font-size:18px; text-align:center; }
#colonne_gauche, #colonne_droite{ width : 400px; }
* a.info { position: relative; color: black; text-decoration: none; }
a.info span { display: none; /* on masque l'infobulle */
} a.info:hover { background: none; /* correction d'un bug IE */ z-index: 999; /* on définit une valeur pour l'ordre d'affichage */
cursor: help; /* on change le curseur par défaut en curseur d'aide */ } a.info:hover span { display: inline; /* on affiche l'infobulle */ position: absolute;
white-space: normal;
top: 50px; left: 10px;
background-color: white;
color: #4A2113; -moz-border-radius : 5px 5px 5px 5px; padding: 3px;
border: 2px solid black ; width: 150px;} | |
|
Contenu sponsorisé
| Sujet: Re: Les Page d'acceuil | |
| |
|