HTML, CSS et class

**mcdelay** · 22/04/2008, 09h57

Bonjour,

J'essaye d'utiliser les feuilles de style sur une page HTML par l'intermédiaire d'une classe sur une balise TABLE mais ca n'a pas l'air de fonctionner... et je ne vois pas pourquoi . La feuille de style se trouve bien dans le même répertoire que la page html.

Feuille HTML (je n'ai mis qu'une partie)

Code html :

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
<HTML>
<HEAD>
<LINK REL="stylesheet" HREF="cssReport.css" TYPE="text/css">
</HEAD>
<TABLE  class='table' CELLSPACING='0'  valign='top'  border='0'  width='650'  heigth='3500' >
<TR >
<TD align=center>
<br><br><br><br><h2>Répartition des passages des véhicules <br>Rue du croisille entre 0 et 6h, du 06 Février  au 14 Mars 2008<br> par fourchettes de vitesses.</h2><br>
</TD>
 
</TR>
<TR >
<TD align=center>
<br><br><TABLE  class='tableReport'  CELLSPACING='0'  valign='top' >
<TH colspan =3 CLASS='entete'>
Tableau Récapitulatif
</TH>
<TR >
<TD>
Tranches Horaires
</TD>
<TD>
Nombre de Vehicules
</TD>
<TD>
Pourcentage
</TD>
 
</TR>
<TR >
<TD>
00 à 30 km/h
</TD>
<TD>... </TABLE>
</HTML>

Feuille de style :

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
.table{
border-style:solid; 
border-width:0px; 
border-color:#828282;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-weight: bold;
color: black;
}
 
.tableReport{
border-style:solid; 
border-width:1px; 
border-color:#828282;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-weight: bold;
color: red;
}
 
.entete{
background-color: #b4b4b4;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: black;
}

Merci

**kaiser59** · 22/04/2008, 10h32

Salut,

Met déjà ton contenu (table) entre les balises

Code html :

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

<body>...</body>

**Siguillaume** · 22/04/2008, 13h44

Et qu'est ce qui ne marche pas?

**mcdelay** · 22/04/2008, 15h38

Par exemple, les bodures de tableReport n'apparaissent pas. Je sais que je peux utiliser BODER directement dans le tag <table> , mais je souhaiterais passer dans les feuilles de style. Le tag BOBY n'a rien changé.

**Er3van** · 22/04/2008, 16h04

Le même code en indenté et avec les qq balises qui manquent en fin, et en retirant tout ce qui est inutile : tu déclares entre autre ta bordure dans ta balise table alors que tu la définies également dans ton css.

Code HTML :

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
 
<TABLE  class='table' border='1px'>
	<TR >
		<TD align=center>
			<br/>
			<h2>Répartition des passages des véhicules 
			<br/>Rue du croisille entre 0 et 6h, du 06 Février  au 14 Mars 2008
			<br/> par fourchettes de vitesses.</h2>
		</TD>
	</TR>
	<TR >
		<TD align=center>
			<TABLE  class='tableReport'>
				<TH CLASS='entete' colspan =3 >
					Tableau Récapitulatif
				</TH>
				<TR>
					<TD>
						Tranches Horaires
					</TD>
					<TD>
						Nombre de Vehicules
					</TD>
					<TD>
						Pourcentage
					</TD>
				</TR>
				<TR >
					<TD>
						00 à 30 km/h
					</TD>
				</TR>
			</TABLE>
		</TD>
	</TR>
</TABLE>

Pour ce qui est du css, sans modifier grand chose j'arrive au résultat que tu veux, enfin, je suppose :

Code CSS :

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
.table{
border:0px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-weight: bold;
color: black;
padding:0px;  
vertical-align:top;
border:0;
width:800px;
}
 
.tableReport{
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 8pt;
font-weight: bold;
color: red;
padding:0px;
vertical-align:top;
width:100%;
}
 
.tableReport td {
	border:1px solid #FFFFFF; 
}
 
.entete{
background-color: #b4b4b4;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12pt;
font-weight: bold;
color: black;
}

**Candygirl** · 22/04/2008, 16h30

Envoyé par mcdelay

Je sais que je peux utiliser BODER directement dans le tag <table> , mais je souhaiterais passer dans les feuilles de style.

Si c'est le cas, tu devrais doter ta page d'un doctype afin que les navigateurs l'interprètent en mode standard.

En l'absence du doctype les navigateurs sont en mode quirks et interprètent ta page "à l'ancienne". Certains styles ne sont donc pas appliqués conformément aux recommandations css2.1, particulièrement concernant le stylage des tableaux où certaines règles d'héritage (sauf erreur) ne sont pas appliquées afin de ne pas perturber l'affichage des sites d'époque, montés en tableaux.

**Erwan31** · 22/04/2008, 19h11

Envoyé par Candygirl

particulièrement concernant le stylage des tableaux ou certaines règles d'héritage (sauf erreur) ne sont pas appliquées afin de ne pas perturber l'affichage des sites d'époque, montés en tableaux.

En effet, voici une liste assez complète des différences observées en mode de rendu Quirks principalement sur IE6 et IE7.

HTML, CSS et class

CSS

Vue hybride

Discussions similaires

Partager

Partager