Bonjour alors je me suis servis de la page d'accueil complète donnée ICI que je modifie comme je peux si je peux dire mais au vue de mon niveau en html j'ai quelques difficulté sur certain point:
Vous pourrez voir le résultat de ce que j'ai pus faire pour le moment Là
Et déjà vous pourrez voir quelques problème, je n'arrive pas à corriger les erreurs de mot avec accent ceux-ci se remplace par d'autre lettre et forme.
J'aimerais mettre un texte en scroll comme vous pouvez le voir sous le bloc au titre: L'alliance Yéti vous souhaite la bienvenue sur son forum
Mais celui-ci commence bien plus bas que l'encadrement
Dans le bloc des partenaires ma 2è image amène vers TFA au lieu du site voulu
J'aimerai centrer tout mes bloc horizontalement
Et enfin (pour le moment car je n'es pas encore tenter de changer autre chose) j'aimerais espacé un peu plus les 3blocs du bas pour que ma page donne moins l'effet de paquet cela est-il possible???
Voici donc ma page HTML:
Merci^^
Vous pourrez voir le résultat de ce que j'ai pus faire pour le moment Là
Et déjà vous pourrez voir quelques problème, je n'arrive pas à corriger les erreurs de mot avec accent ceux-ci se remplace par d'autre lettre et forme.
J'aimerais mettre un texte en scroll comme vous pouvez le voir sous le bloc au titre: L'alliance Yéti vous souhaite la bienvenue sur son forum
Mais celui-ci commence bien plus bas que l'encadrement
Dans le bloc des partenaires ma 2è image amène vers TFA au lieu du site voulu
J'aimerai centrer tout mes bloc horizontalement
Et enfin (pour le moment car je n'es pas encore tenter de changer autre chose) j'aimerais espacé un peu plus les 3blocs du bas pour que ma page donne moins l'effet de paquet cela est-il possible???
Voici donc ma page HTML:
- Spoiler:
- Code:
<center><FONT COLOR="RED"><div style="width: 810px"><div id="descr">
<h1 class="h1_pres">PAGE EN-COURS DE CONSTRUCTION MERCI DE CLIQUER SUR LA BANNIÈRE POUR VOUS RENDRE SUR LE FORUM</h1></center>
<!--fond de page-->
<BODY BACKGROUND="http://img39.imageshack.us/img39/116/fond10v2.png">
<center><!-- Lecteur de musique-->
<embed src="http://www.archive-host.com/mediaplayer.swf" width="230" height="20" allowscriptaccess="always" allowfullscreen="true" flashvars="height=20&width=230&file=http://www.archive-host.com/files/794415/16c002f13527daf8fe86fc16e9858f5aaef5128f/05_-_Tifa_no_Theme_Piano_Version.mp3&volume=50&searchbar=false&autostart=true" />
<!--Bannière avec lien-->
<A HREF="http://yeti.frenchboard.com/forum"><CENTER><IMG SRC="http://img130.imageshack.us/img130/4408/bannirely.png" HEIGHT=300 WIDTH=800 BORDER=0 ALT="logo Alliance YETI" ALIGN=TOP><CENTER></A>
<FONT COLOR="blue"><div style="width: 810px"><div id="descr">
<h1 class="h1_pres">L'alliance Yéti vous souhaite la bienvenue sur son forum</h1>
<p>
<marquee direction="up" scrollamount="1.5" height="200" width="300">
ICI Texte Présentation DU FOFO
</marquee>
</p>
</div>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-15" />
<title>Page d'accueil Yéti</title>
<style type="text/css" media="screen">
/* Menu du Message d accueil */
#menu, #menu ul /* Liste */
{
padding : 0; /* pas de marge intérieure */
margin : 0; /* ni extérieure */
list-style : none; /* on supprime le style par défaut de la liste */
line-height : 21px; /* on définit une hauteur pour chaque élément */
text-align : center; /* on centre le texte qui se trouve dans la liste */
}
#menu li /* Elements des listes */
{
float : left;
/* pour IE qui ne reconnaît pas "transparent" */
border-right : 1px solid #fff; /* on met une bordure blanche à droite de chaque élément */
}
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li
{
border-right: 1px solid transparent ; /* on met une bordure transparente à droite de chaque élément */
}
#menu li ul /* Sous-listes */
{
position: absolute; /* Position absolue */
width: 126px; /* Largeur des sous-listes */
left: -999em; /* Hop, on envoie loin du champ de vision */
}
#menu li ul li /* Éléments de sous-listes */
{
/* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
border-top : 1px solid #fff; /* on met une bordure blanche en haut de chaque élément d'une sous liste */
}
/* IE ne reconnaissant pas le sélecteur ">" */
html>body #menu li ul li
{
border-top : 1px solid transparent; /* on met une bordure transparente en haut de chaque élément */
}
#menu li ul ul
{
margin : -22px 0 0 126px ; /* On décale les sous-sous-listes pour qu'elles ne soient pas au dessus des sous-listes */
/* pour IE qui ne reconnaît pas "transparent" (comme précédemment) */
border-left : 1px solid #fff ; /* Petite bordure à gauche pour ne pas coller ... */
}
/* IE ne reconnaissant pas le sélecteur ">" ... je me répète ;-) */
html>body #menu li ul ul
{
border-left : 1px solid transparent ; /* on met une bordure transparente sur la gauche de chaque élément */
}
#menu li:hover ul ul, #menu li.sfhover ul ul /* Sous-sous-listes lorsque la souris passe sur un élément de liste */
{
left: -999em; /* On expédie les sous-sous-listes hors du champ de vision */
}
#menu li:hover ul, #menu li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul /* Sous-listes lorsque la souris passe sur un élément de liste ET sous-sous-lites lorsque la souris passe sur un élément de sous-liste */
{
left: auto; /* Repositionnement normal */
min-height: 0; /* Corrige un bug sous IE */
}
/* le style du menu personnalisable même pour les novices. */
#menu a:hover /* Lorsque la souris passe sur un des liens */
{
background-image: url("http://i65.servimg.com/u/f65/11/95/30/70/code_c11.jpg");
}
#menu /* Ensemble du menu */
{
font-weight : bold; /* on met le texte en gras */
font-family : Arial; /* on utilise Arial, c'est plus beau ^^ */
font-size : 12px; /* hauteur du texte : 12 pixels */
}
#menu a /* Contenu des listes */
{
display : block; /* on change le type d'élément, les liens deviennent des balises de type block */
padding : 0; /* aucune marge intérieure */
color : #fff; /* couleur du texte ici blanc */
text-decoration : none; /* on supprime le style par défaut des liens (la plupart du temps = souligné) */
width : 126px; /* largeur */
background-color: black; /* le fond en noire */
}
/* les titre */
.h2_pres
{
font-size: 14px;
text-shadow: 0px 0px 9px #777;
color: #fff;
border-bottom: 1px dashed blue;
}
.h1_pres
{
font-size: 16px;
text-shadow: 0px 0px 9px #777;
color: #fff;
border-bottom: 1px dashed blue;
}
/* les boites */
#descr
{
margin-top:35px;
float: left;
border: 1px dashed blue;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
width: 850px;
margin-bottom: 0px;
margin-right: 0px;
margin-left: 0px;
Padding-left: 0px;
Padding-bottom: 0px;
text-align: center;
background-color: white;
height: 150px;
font-size: 12px;
color: white;
}
#newss
{
margin-top:35px;
float: left;
border: 1px dashed blue;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
width: 850px;
margin-bottom: 35px;
margin-right: 0px;
margin-left: 0px;
Padding-left: 0px;
Padding-bottom: 0px;
text-align: center;
background-color: white;
overflow-y: auto;
overflow-x: visible;
height: 160px;
font-size: 12px;
color: white;
}
.staffs /* les deux premieres boites du bah */
{
height: 215px;
width: 258px;
float: left;
border: 4px dashed blue ;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
margin-left: 10px;
border: 1px dashed blue ;
background-color: white;
text-align: center;
}
.staffss /* la boite toute à droite */
{
height: 215px;
width: 258px;
float: left;
border: 4px dashed blue ;
-moz-border-radius: 10px;
-webkit-border-radius: 10px;
-khtml-border-radius: 10px;
border-radius: 10px;
margin-left: 10px;
border: 1px dashed blue ;
background-color: white;
text-align: center;
}
/* les scrolles et les bugs */
/* Pour les defilement */
#scroller_container
{
padding-top: 75px;
overflow: hidden;
}
/* CSS Hack Safari */
#dummy
{
;#
}
#scroller_container
{
overflow: auto;
}
p
{
margin: 0px;
}
.transparence {
background-color: transparent;
border: none;
opacity: 0.5;
}
.transparence:hover{
background-color: transparent;
border: none;
opacity: 2;
}
#ejs_texte
{
width: 200px;
height: 100px;
color: white;
border: 1px dashed blue.
margin-left: auto;
margin-right: auto;
margin-top: 10px;
padding: 5px;
}
</style>
</head>
<body>
<center><div id="newss">
<h1 class="h1_pres">News</h1>
<p>[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
[13.03] Tous les crédits du thèmes et du message d'accueil et encore plus sont disponible là
</p>
</div><div class="staffs">
<h2 class="h2_pres">Nos partenaires</h2>
<a href="http://www.themes-fa.com/forum.htm"><img src="http://i85.servimg.com/u/f85/11/95/30/70/bouton11.gif" alt="Thème FA></img></a>
<a href="http://www.fushigi-yume.com"><img src="http://www.fushigi-yume.com/fushigi_88x31.gif" alt="Fushigi Yume"></img></a>
<a href="http://www.forumactif.com"><img src="http://www.illiweb.com/fa/banner/fr/banner3.jpg" alt="créer un forum" title="forumactif.com" /></a>
</div></div>
</div><div class="staffs"><h1 class="h1_pres">Staff</h1>
<A HREF="http://dailylife.forumactif.org/profile.forum?mode=viewprofile&u=1" onmouseover="ChangeMessage('<strong>Pseudos : </strong> XXXXXX<br/> <strong>Rang : </strong> Fondateur<br/> <strong>Inscription : </strong> 06/11/2009<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i62.servimg.com/u/f62/15/12/96/51/accuei10.jpg" class="transparence"></A>
<!-- CODE DU LIEN - VOUS POUVEZ EN PLACER PLUSIEURS SUR VOTRE PAGE -->
<A HREF="http://dailylife.forumactif.org/profile.forum?mode=viewprofile&u=5" onmouseover="ChangeMessage('<strong>Pseudos : </strong> XXXXXX<br/> <strong>Rang : </strong> Co-Admin<br/> <strong>Inscription : </strong> 19/12/2009<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i62.servimg.com/u/f62/15/12/96/51/accue_10.jpg" class="transparence"></A>
<A HREF="http://dailylife.forumactif.org/profile.forum?mode=viewprofile&u=20" onmouseover="ChangeMessage('<strong>Pseudos : </strong> XXXXXX<br/> <strong>Rang : </strong> Co-Admin<br/> <strong>Inscription :</strong> 12/06/2010<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i64.servimg.com/u/f64/13/94/82/69/sans_t10.png" class="transparence"></A>
<!-- CODE DU LIEN - VOUS POUVEZ EN PLACER PLUSIEURS SUR VOTRE PAGE -->
<A HREF="http://dailylife.forumactif.org/profile.forum?mode=viewprofile&u=6" onmouseover="ChangeMessage('<strong>Pseudos : </strong> XXXXX<br/> <strong>Rang :</strong> Modérateur <br/> <strong>Inscription :</strong> 13/04/2010<br/>','ejs_texte')" onmouseout="ChangeMessage('','ejs_texte')"><img src="http://i62.servimg.com/u/f62/15/12/96/51/accuei11.jpg" class="transparence"></A>
<!--
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 class="staffss"><h1 class="h1_pres">Liens Utile (à mettre sous image)</h1>
o10c => http://www.o10c.eu
Lien de secours o10c => http://o10c.c.la/
Forum officiel o10c => http://forum-o10c.fr/
</div>
</div>
<script type="text/javascript" src="http://s3.archive-host.com/membres/up/1696114791/java/jscroller2-161.js"></script>
<script type="text/javascript">
sfHover = function() {
var sfEls = document.getElementById("menu").getElementsByTagName("LI");
for (var i=0; i<sfEls.length; i++) {
sfEls[i].onmouseover=function() {
this.className+=" sfhover";
}
sfEls[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" sfhover\\b"), "");
}
}
}
if (window.attachEvent) window.attachEvent("onload", sfHover);
function ChangeMessage(message,champ)
{
if(document.getElementById)
document.getElementById(champ).innerHTML = message;
}
</center>
</script>
</body>
</html>
Merci^^



par 



