Argh ! Tu commence déjà à rajouter plein de trucs inutiles
Pour les tailles des images, ok
Mais pour le reste : c'est non
Code : Tout sélectionner
<li><img border="0" src="images/arch_menu_logo.gif" width="195" height="233" alt="Logo"></li>
<li><img border="0" src="images/arch_marge.gif" width="21" height="454" alt="M"></li>
C'est purement décoratif, ça se mettra dans la CSS
Pour la bannière à mon avis elle a aussi sa place dans la CSS
Ensuite j'avais bien mis
<ul id="menu">. Un id c'est un identifiant unique. C'est utile si tu n'en mets qu'un seul par page. Je ne pense pas que tu veuilles mettre plusieurs menus
donc ==> id 8)
Le code de Xiti on le mettra après. De toutes façons il est invalide comme tu as surement pu le constater en validant ta page.
http://validator.w3.org/
Bref, reprend exactement le code que je t'avais donné, mets-y les images pour le menu (mais que celles ayant du texte), et c'est tout
Petit hs sur le format des images : tu as des images GIF. Le Gif est un format propriétaire fermé, je crois que les logiciels qui permettent de l'enregistrer doivent payer des royalties ou des trucs comme ça
Utilise le PNG, c'est un format ouvert, standardisé par le W3C (comme le HTML). Un outil pour convertir rapidement et simplement des images GIF :
Png optimizer
Pour l'insertion de la CSS tu as compris
Code : Tout sélectionner
<link rel="stylesheet" href="style.css" type="text/css" title="Treuz Mod">
Tout juste
Alors crées un fichier style.css (ou autre), et lie-le.
Ça fonctionne de la manière suivante :
Code : Tout sélectionner
/* commentaire */
sélecteur {
propriété:valeur;
propriété:valeur;
}
sélecteur {
propriété:valeur;
propriété:valeur;
}
La syntaxe est ultra-simple.
Les sélecteurs :
- Si tu veux sélectionner tous les liens (a), le sélecteur est a
- Si tu veux sélectionner les éléments qui ont l'attribut id=menu c'est #menu
- Si tu veux sélectionner les éléments dont la classe est class="sous-titre" c'est .sous-titre (avec un point)
- Pour sélectionner tous les p qui ont class="sous-titre" mais pas par exemple les a class="sous-titre" éventuels : p.sous-titre (sans espace entre le p et le .sous-titre). Idem pour le ul#menu qui ne sélectionnera pas un éventuel menu sous forme de dl par exemple
- Pour sélectionner les a qui sont contenu dans ul id="menu", il faut utiliser le sélecteur descendant. C'est un simple espace. #menu a sélectionne rous les a contenu dans #menu.
Etc. Avec ça tu peux presque tout faire. Pour plus de sélecteurs :
http://www.yoyodesign.org/doc/w3c/css2/selector.html
Ainsi tu peux sélectionner sur quoi tu va appliquer les styles qui seront contenus entre { et }.
Par exemple, pour mettre un fond noir sur le body :
Tu sélectionne l'élément body et tu lui mets un fond gris. Tu peux faire pareil sur un paragraphe ou autre.
Ensuite ton menu pourrait être à gauche plutôt qu'au-dessus. Pour ça tu peux utiliser float:left. Ainsi ton menu va être déplacé de côté et le contenu va passer de l'autre. Je te laisse trouver le sélecteur sur lequel l'appliquer
Bon, ben te voilà lancé. Une liste des propriétés que tu peux utiliser (malheureusement en anglais) :
http://www.htmldog.com/reference/cssproperties/
Essaye de créer cette page html (sans tout ce que j'ai dit plus haut), avec la CSS, et si tu arrives à la mettre en ligne que l'on puisse voir son développement au fur et à mesure ce serait super
