Aide pour création de page
Eo
-
Eo -
Eo -
Bonjour,
j'ai besoin d'aide pour créer une page sur laquelle il y aurait en haut une bannière, juste en dessous une ligne avec différents liens et une colonne sur la gauche, mais sans utiliser de frameset. Il y aurait le contenu de la page au centre. J'ai essayé avec les balises div, mais le contenu se met en dessous du dernier cadre. Pouvez vous m'aider svp ? (J'ai essayé en html, mais je suis preneuse aussi pour du javascript)
Merci de vos réponses
j'ai besoin d'aide pour créer une page sur laquelle il y aurait en haut une bannière, juste en dessous une ligne avec différents liens et une colonne sur la gauche, mais sans utiliser de frameset. Il y aurait le contenu de la page au centre. J'ai essayé avec les balises div, mais le contenu se met en dessous du dernier cadre. Pouvez vous m'aider svp ? (J'ai essayé en html, mais je suis preneuse aussi pour du javascript)
Merci de vos réponses
A voir également:
- Aide pour création de page
- Impossible de supprimer une page word - Guide
- Creation de site web - Guide
- Creation compte gmail - Guide
- Creation de compte google - Guide
- Media creation tool - Télécharger - Systèmes d'exploitation
5 réponses
Bonjour,
javascript ne sert pas à la mise en page.
Actuellement le CSS est utilisé en complément des baises html qui vont servir de container tandis que des "règles" ou "styles" CSS que vous allez définir vont permettre plus de possibilités(sur l'aspect et le positionnement).
Sans utiliser de CSS connaissez vous les tableaux (table) et le retour à la ligne(br). Cela donnerait le HTML suivant.
<html>
<!--// CE CODE HTML EST DESUET CAR NE COMPORTES PAS DE CSS ET QUE LES NORMES DEPUIS LE HTML1.0 ONT CHANGES IL Y A DES ANNEES //-->
<head>
</head>
<body>
<center><!--// LA BALISE CENTER EST A EVITER, voir son équivalent en css //-->
<div width="100%"><!--// L'ATTRIBUT WIDTH NE DOIT PLUS ETRE UTILISE, voir son équivalent en css //-->
<img src="bandeau.jpg" />
</div>
<br/><!--// le saut à la ligne est pas indispensable puisque le div fait 100% de la largeur //-->
<table width="100%"><!-- début de la table, cette balise dot être réservée aux données tabulaires et non pour le positionnement comme avant le CSS, même remarque qu'auparavant sur l'attribut width //-->
<tr><!-- début de la 1ere ligne -->
<td <idth="40%"><!-- début de la 1ere colonne, même remarque qu'auparavant sur l'attribut width-->
<p>
ICI LA GAUCHE DE LA PAGE(occupe 40% de la page)
</p>
</td><!-- fin de la première colonne de la ligne 1 -->
<td><!-- début 2ème colonne 1ère ligne -->
<h1>
ICI LA DROITE(que vous nommez partie centrale, il faudrait une 3 ème colonne pour que ce soit central) DE LA PAGE SOIT 100%-40%=60% de l'espace total.
</h2>
</td>
</tr><!--// fin première ligne //-->
<tr><!-- pour le fun j'insères une 2ème ligne //-->
<td>
Chaque case d'un tableau se nomme:
</td>
<td>
une cellule
</td>
</tr>
</table><!-- balise fermante du tableau évidemment -->
<p style="font-style:italic;font-size:1.5em;letter-spacing:0.33em;">
Un peu de style CSS pour la forme(remarquez l'attribut style dans la balise p):
<br/>
Le tableau (balise table) peut aussi avoir un titre(balise caption et ligne horizontale plutôt que des cellules(th), mais bon c'est plus compliqué qu'un bon positionnement en css et pas respectueux des normes sur lesquelles les navigateurs actuels se conforment au maximum.
</p>
</center>
</body>
</html>
javascript ne sert pas à la mise en page.
Actuellement le CSS est utilisé en complément des baises html qui vont servir de container tandis que des "règles" ou "styles" CSS que vous allez définir vont permettre plus de possibilités(sur l'aspect et le positionnement).
Sans utiliser de CSS connaissez vous les tableaux (table) et le retour à la ligne(br). Cela donnerait le HTML suivant.
<html>
<!--// CE CODE HTML EST DESUET CAR NE COMPORTES PAS DE CSS ET QUE LES NORMES DEPUIS LE HTML1.0 ONT CHANGES IL Y A DES ANNEES //-->
<head>
</head>
<body>
<center><!--// LA BALISE CENTER EST A EVITER, voir son équivalent en css //-->
<div width="100%"><!--// L'ATTRIBUT WIDTH NE DOIT PLUS ETRE UTILISE, voir son équivalent en css //-->
<img src="bandeau.jpg" />
</div>
<br/><!--// le saut à la ligne est pas indispensable puisque le div fait 100% de la largeur //-->
<table width="100%"><!-- début de la table, cette balise dot être réservée aux données tabulaires et non pour le positionnement comme avant le CSS, même remarque qu'auparavant sur l'attribut width //-->
<tr><!-- début de la 1ere ligne -->
<td <idth="40%"><!-- début de la 1ere colonne, même remarque qu'auparavant sur l'attribut width-->
<p>
ICI LA GAUCHE DE LA PAGE(occupe 40% de la page)
</p>
</td><!-- fin de la première colonne de la ligne 1 -->
<td><!-- début 2ème colonne 1ère ligne -->
<h1>
ICI LA DROITE(que vous nommez partie centrale, il faudrait une 3 ème colonne pour que ce soit central) DE LA PAGE SOIT 100%-40%=60% de l'espace total.
</h2>
</td>
</tr><!--// fin première ligne //-->
<tr><!-- pour le fun j'insères une 2ème ligne //-->
<td>
Chaque case d'un tableau se nomme:
</td>
<td>
une cellule
</td>
</tr>
</table><!-- balise fermante du tableau évidemment -->
<p style="font-style:italic;font-size:1.5em;letter-spacing:0.33em;">
Un peu de style CSS pour la forme(remarquez l'attribut style dans la balise p):
<br/>
Le tableau (balise table) peut aussi avoir un titre(balise caption et ligne horizontale plutôt que des cellules(th), mais bon c'est plus compliqué qu'un bon positionnement en css et pas respectueux des normes sur lesquelles les navigateurs actuels se conforment au maximum.
</p>
</center>
</body>
</html>
code html
code css
<div id="bandeau">Ceci est le bandeau</div> <div id="menu"> <div id="menu_haut">Menu haut</div> <div id="menu_bas">Menu bas</div> </div> <div id="contenu">Ceci est le contenu</div> <div id="pied_page">Ceci est le pied de page</div>
code css
div {
text-align:center;
}
div#bandeau {
width:600px;
height:50px;
background-color:#00CCFF;
}
div#menu {
float:left;
width:100px;
height:400px;
background-color:#FF6699;
}
div#menu_haut {
width:100px;
height:200px;
background-color:#66CC33;
}
div#menu_bas {
width:100px;
height:200px;
background-color:#CC99CC;
}
div#contenu {
float:left;
width:500px;
height:400px;
background-color:#FFCC00;
}
div#pied_page {
clear:both;
width:600px;
height:50px;
background-color:#33FF99;
}
Vous n’avez pas trouvé la réponse que vous recherchez ?
Posez votre question
