Afficher page sur site

**Lolo92160** · 08/12/2009, 08h43

Bonjour à tous,

désolé mais je suis débutant, donc ma demande est peut-être idiote et pas à sa place...

.

Voilà, j'ai créé un CSS, jusque-là tout va bien. Il y a 3 emplacements: entête, menu, Texte. Pour l'entête et le menu pas de souci, par contre je souhaite, quand je selectionne un de mes lien de menu charger une page dans "contenu" (le truc de base quoi) genre "page.htm". Je ne sais pas du tout comment faire..
Voici un code qui correspond à peu près au mien, ça me permettra d'adapter...

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="content-type"
 content="text/html; charset=ISO-8859-1" />
  <title>css vdb</title>
  <style type="text/css">
#conteneur { border-style: solid;
border-width: 1px;
background-color: rgb(255, 204, 204);
width: 90%;
margin-left: 5%;
}
#entete { background-color: rgb(51, 102, 255);
background-image: url(../tesbanv2.JPG);
}
#menu { margin: -1px 0pt 0pt -1px;
background: transparent none repeat scroll 0% 50%;
-moz-background-clip: initial;
-moz-background-origin: initial;
-moz-background-inline-policy: initial;
width: 7em;
float: left;
min-height: 100%;
}
#menu ul { border: 1px solid rgb(170, 170, 170);
margin: 0pt;
padding: 0pt;
background: white url(../bouton.JPG) repeat scroll 0% 50%;
-moz-background-clip: initial;
-moz-background-origin: initial;
-moz-background-inline-policy: initial;
width: 7em;
text-align: center;
color: rgb(255, 204, 153);
}
#menu li { border-bottom: 1px solid rgb(204, 204, 204);
margin: 0pt;
position: relative;
list-style-type: none;
list-style-image: none;
list-style-position: outside;
}
#menu li:hover { background-repeat: repeat;
background-attachment: scroll;
background-position: 0% 50%;
background-image: url(../bouton2.JPG);
}
#menu li.submenu { background-attachment: scroll;
background-position: 95% 50%;
background-repeat: repeat;
}
#menu li.submenu:hover { background-image: url(../bouton2.jpg);
}
#menu li a { padding: 0.25em 0pt 0.25em 0.5em;
display: block;
text-decoration: none;
width: 6.5em;
}
#menu > ul a { width: auto;
}
#menu ul ul { border: 1px solid rgb(170, 170, 170);
margin: 0pt;
padding: 0pt;
background: white url(../bouton.jpg) repeat scroll 0% 50%;
-moz-background-clip: initial;
-moz-background-origin: initial;
-moz-background-inline-policy: initial;
position: absolute;
top: 0pt;
left: 7em;
display: none;
width: 7em;
text-align: center;
}
#menu ul.level1 li.submenu:hover ul.level2, #menu ul.level2 li.submenu:hover ul.level3 { display: block;
background-image: url(../bouton2.jpg);
}
#texte { }
#pied { background-color: rgb(204, 0, 0);
width: 100%;
clear: left;
}
  </style>
</head>
<body>
<div id="conteneur">
<div id="entete"><br />
<br />
<br />
<br />
<br />
<br />
</div>
<div id="menu">
<ul class="level1">
  <li><a href="/">Le Club</a></li>
  <li class="submenu"><a href="">Les joueurs</a>
    <ul class="level2">
      <li class="submenu"><a href="">Classements</a>
        <ul class="level3">
          <li><a href="">Alphab&eacute;tique</a></li>
          <li><a href="">Points</a></li>
        </ul>
      </li>
      <li><a href="">Progression</a></li>
    </ul>
  </li>
  <li class="submenu"><a href="">R&eacute;sultats</a>
    <ul class="level2">
      <li><a href="">Strategy</a></li>
      <li><a href="">Optimization</a></li>
      <li><a href="">Guidance</a></li>
      <li><a href="">Training</a></li>
    </ul>
  </li>
  <li><a href="">Calendrier</a></li>
  <li><a href="">R&egrave;glement</a></li>
  <li><a href="">Contacts</a></li>
  <li><a href="">Livre d'or</a></li>
  <li><a href="">Forum</a></li>
  <li><a href="">Liens utiles</a></li>
  <li><a href="">Contact</a></li>
</ul>
</div>
<div id="texte">texte<br />
<br />
<br />
</div>
<div id="pied">pied</div>
</div>
</body>
</html>

Merci d'avance pour votre aide...

**Bisûnûrs** · 08/12/2009, 08h53

Soit tu utilises des frames, soit tu utilises de l'AJAX.

Dans les deux cas, c'est pas top pour le référencement ni l'accessibilité.

**Lolo92160** · 08/12/2009, 09h01

Envoyé par Bisûnûrs

Soit tu utilises des frames, soit tu utilises de l'AJAX.

Dans les deux cas, c'est pas top pour le référencement ni l'accessibilité.

J'ai peut-être mal compris mais justement si on utilise un CSS, ce n'est pas pour éviter d'utiliser les frames???

**Bisûnûrs** · 08/12/2009, 09h09

Le CSS ne permet pas de charger une page en plein milieu du code HTML d'une autre.

**Lolo92160** · 08/12/2009, 09h25

Envoyé par Bisûnûrs

Le CSS ne permet pas de charger une page en plein milieu du code HTML d'une autre.

Oups, j'ai mal compris.....

Donc, en fait, il faut créer chaque page à l'aide du CSS et changer uniqement le contenu???

**Bisûnûrs** · 08/12/2009, 09h43

Le CSS n'est que la présentation des données.

Il faut juste créer chaque page. Le contenu se change quand tu cliques sur un lien et que toute la page est rechargée.

Afficher page sur site

HTML

Vue hybride

Discussions similaires

Partager

Partager