Débutant =) -> différence entre cadre et tableau
Débutant =) -> différence entre cadre et tableau - HTML/CSS - Programmation
Marsh Posté le 10-09-2007 à 17:46:27
| mrplop a écrit : Bonjour à tous, |
Salut.
Avant on utilisait toujours des tableaux. Maintenant, pour éviter maintes problèmes et avoir un code beaucoup plus clair et facilement évolutif, on utilise le CSS. Ce qui ne veut pas dire que les tableaux ne sont plus utiles! Cela dépend juste de l'usage que l'on en fait.
Voici une adresse qui te sera bien utile pour débuter en CSS comme tu veux le faire je pense.
http://www.zdnet.fr/builder/web_de [...] 4-2,00.htm
C'est ainsi que j'ai débuté et ca marche très bien!
Bonne chance et au plaisir
Marsh Posté le 10-09-2007 à 21:05:23
Sous Dream :
Cadre = Frame, à jamais utiliser, à part cas très très rare.
Tableau = sers à mettre des données de type tabulaire. A ne jamais utiliser pour la mise en page.
http://css.alsacreations.com/Model [...] age-en-CSS
Marsh Posté le 11-09-2007 à 16:29:44
merci xtof_83 !!!
avec ça, je vais pouvoir avancer un grand coup =)
et donc si j'ai bien compris, je ne dois utiliser ni l'un ni l'autre pour mon site...
bon bah j'essaie de me mettre au css de suite
Marsh Posté le 11-09-2007 à 16:54:45
Bon en fait voici un petit schema du site que je veux faire, si vous avez des conseils à me donner... 
(les zones totalement blanches seront remplies avec des images évidemment 
)
Marsh Posté le 11-09-2007 à 21:39:39
Ben regarde le lien que je t'ai envoyé. Clique sur exemple. on arrive à ce que tu veux... Tu n'as qu'à enlever la partie de droite.
Mais mets-toi au CSS directement, tu ne le regretteras pas!
N'hésite pas si tu coinces, je t'aiderai...
Marsh Posté le 11-09-2007 à 23:37:12
J'ai vu, je suis justement en train de bosser dessus pour essayer d'en tirer un truc bien
J'essaie de mixer ce que j'ai vu à partir de ton lien et du lien de xtof_83
| bingojm a écrit : |
Oula... c'est pas des trucs à me dire ça
---------------
sauvez un arbre, mangez un castor...
Marsh Posté le 11-09-2007 à 23:49:03
je sais ce que c'est de débuter. Alors je comprends.
Bonne chance!
Marsh Posté le 18-09-2007 à 00:09:22
yop,
j'ai un petit souci avec ce que je suis en train de faire : j'ai repris un des exemples du dessus et j'essaie de rajouter une marge de 20px sur le côté droit, juste après le scroll mais la cellule ne se met pas où il le faudrait 
voici le 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" xml:lang="fr" lang="fr">
<head>
<title>4 zones avec scroll</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<style type="text/css">
<!--
body {
margin: 0;
padding: 0;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size: 0.8em;
background-color: #fff; /*couleur de fond blanche*/
}
.conteneur { /*le conteneur global du site, qui sera centré */
position: relative;
width: 800px;
margin: 0 auto;
}
.header {
height: 180px;
background-color: #99CCCC;
}
.menu {
position: absolute;
left:0;
width: 200px;
height: 400px;
background-color:#CCCCFF;
}
.frame {
margin-left: 200px;
width: 580px;
height: 400px;
background-color:#9999CC;
overflow: auto;
}
.marge {
margin-left: 780px;
width: 20px;
height: 400px;
background-color:#00FF33;
}
.footer {
height: 20px;
background-color: #99CC99;
}
p {
margin: 0 0 5px 0;
}
.menugauche {
list-style-type: none;
margin: 0;
padding:0;
}
.menugauche li {
margin-bottom: 5px;
}
.menugauche a {
margin: 0 2px;
color: #000000;
text-decoration: underline;
}
.menugauche a:hover {
text-decoration: none;
}
-->
</style>
</head>
<body>
<div class="conteneur">
<div class="header">contenu du header de taille fixe : 750px</a>
</div>
<div class="menu"><p>menu gauche de largeur fixe : 150px</p>
<ul class="menugauche">
<li><a href="">Menu 1</a></li>
<li><a href="">Menu 2</a></li>
<li><a href="">Menu 3</a></li>
<li><a href="">Menu 4</a></li>
</ul>
</div>
<div class="frame">
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
<p>partie "frame" scrollable </p>
</div>
<div class="marge">x </div>
<div class="footer">contenu du footer de taille fixe :
750px </div>
</div>
</body>
</html>
pour avoir ce que j'ai à la base, il faut supprimer la partie .marge, mettre 600 au lieu de 580 dans la partie frame, et virer la ligne div class= marge.
une idée de comment résoudre ça ?
de plus, je voudrais mettre des images survolées dans le menu à la place du texte. Est-ce que je dois mettre un tableau dans cette cellule pour y arriver ?
Merci d'avance 
---------------
sauvez un arbre, mangez un castor...
Marsh Posté le 26-09-2007 à 14:58:11
Salut,
J'ai pas analysé ton code mais je te recommande de mettre ton CSS dans un fichier séparé. Genre style.css.
C'est pas compliqué
Marsh Posté le 26-09-2007 à 15:29:09
Tu peux essayer ça :
.menu {
width: 200px;
height: 400px;
background-color:#CCCCFF;
float: left;
}
.frame {
width: 580px;
height: 400px;
background-color:#9999CC;
overflow: auto;
float: left;
}
.marge {
width: 20px;
height: 400px;
background-color:#00FF33;
float: right;
}
---------------
Fred => http://www.meance.free.fr
Sujets relatifs:
- Définir message d'abence du bureau [vba]
- [regexp] Extraire les lignes d'un tableau d'une page html
- durée de vie d'un tableau
- simple script a corriger de la part d'un grand debutant
- Problème de débutant :p.
- simplexml object dans un tableau: asXML n'existe plus :s
- Passer souris sur photo pour afficher une image dans un cadre
- Tableau croisé et VBA
- extraire une valeur d'un tableau en retour de fonction
- [python] (debutant) besoin d'un coup de main
Marsh Posté le 10-09-2007 à 17:09:24
Bonjour à tous,
Je me mets tout juste à la création d'un site internet avec Dreamweaver et je sais en grande partie comment sera mon site au final.
Par contre, je vois régulièrement des explications diverses et c'est vrai qu'il y a un truc où j'arrive pas à faire la différence.
Quelle est la différence entre un cadre et un tableau ? Et surtout, qu'y-a-t'il de mieux entre les 2 pour faire un site qui aura un menu à gauche, une bannière en haut et le contenu dans le reste de la fenêtre ?
Merci d'avance
---------------
sauvez un arbre, mangez un castor...