Style bordure tableau doctype xhtml1-strict.dtd

**budyraptor** · 02/08/2008, 13h25

Bonjour à tous,

bon voila j'ai créé une page avec le doctype suivant:

Code :

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

1
2
3
4
 
<!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">

et dans cette page j'ai un tableau que voici:

je suis sous Dreamweaver cs3 et je n'arrive pas à cacher certaines bordures du tableau

que je voudrais comme ceci:

Merci de votre aide

Si le mode fonctionnait comme ce forum ça irai sans doute mieux.

Invité · 02/08/2008, 13h57

Bonjour,

En passant par du CSS

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
<style type="text/css">
table, tr, th, td {
  border-collapse: collapse;
}
 
table {
  border: 1px solid black;
}
 
th {
  border: 1px solid red;
}
 
td {
  border: 1px solid green;
}
</style>

A+

**budyraptor** · 02/08/2008, 16h28

salut jlmag

Merci pour ta réponse ce n'est pas exactement ce que je veux faire ou alors c'est moi qui ne comprends pas.

donc j'ai créé un tableau à l'intérieur du premier avec la classe table1

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
 
 
<table width="312" height="182" border="1">
  <tr>
    <td colspan="3">&lt;table&gt;</td>
  </tr>
  <tr>
    <td width="38" height="42">&lt;tr&gt;</td>
    <td width="214" rowspan="3">
    <table width="214" height="122" border="1" align="center" class="table1">
      <tr>
        <td width="124">&lt;th&gt;......&lt;/th&gt;</td>
        <td width="129">&lt;th&gt;......&lt;/th&gt;</td>
      </tr>
      <tr>
        <td>&lt;th&gt;......&lt;/th&gt;</td>
        <td>&lt;th&gt;......&lt;/th&gt;</td>
      </tr>
      <tr>
        <td>&lt;th&gt;......&lt;/th&gt;</td>
        <td>&lt;th&gt;......&lt;/th&gt;</td>
      </tr>
    </table>    
    </td>
    <td width="38">&lt;/tr&gt;</td>
  </tr>
  <tr>
    <td height="36">&lt;tr&gt;</td>
    <td>&lt;/tr&gt;</td>
  </tr>
  <tr>
    <td height="41">&lt;tr&gt;</td>
    <td>&lt;/tr&gt;</td>
  </tr>
  <tr>
    <td colspan="3">&lt;/table&gt;</td>
  </tr>
</table>

Mon CSS

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
 
<style type="text/css">
 
table1, tr, th, td {
border-bottom:none;
border-top:none;
border-left:none;
border-right:none;
}
 
</style>

mais du coup mon tableau du milieu hérite de la classe aussi

ce qui donne

il y a t'il moyen pour éviter cet héritage? ou alors dois-je modifier aussi
les TR, TH, TD
dans mon Css

merci

Invité · 02/08/2008, 18h36

Re,

et comme cela

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
<!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>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
	<title></title>
<style type="text/css">
.t1 {
	border: medium ridge ThreedLightShadow;
	background-color: lime;
}
 
.t2, .t2 td {
	border: medium ridge ThreedLightShadow;
	background-color: aqua;
	border-collapse: collapse;
}
</style>
</head>
<body>
 
<table class="t1">
  <tr>
    <td colspan="3">&lt;tr1&gt;</td>
  </tr>
  <tr>
    <td>
        &lt;tr&gt;
    </td>
    <td rowspan="3">
            <table class="t2">
              <tr>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
              </tr>
              <tr>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
              </tr>
              <tr>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
                <td>&lt;th&gt;......&lt;/th&gt;</td>
              </tr>
            </table>
    </td>
    <td>
        &lt;/tr&gt;
    </td>
  </tr>
  <tr>
    <td>&lt;/tr&gt;
    </td>
 
    <td>&lt;/tr&gt;
    </td>
  </tr>
  <tr>
    <td>&lt;/tr&gt;
    </td>
 
    <td>&lt;/tr&gt;
    </td>
  </tr>
  <tr>
    <td colspan="3">&lt;tr&gt;</td>
  </tr>
</table>
 
 
</body>
</html>

A+

**budyraptor** · 02/08/2008, 21h16

Merci beaucoup jlmag

c'est exactement ça

en fait tu l'as deviné je débute

je ne connais pas

Code :

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

1
2
3
4
5
 
 
medium ridge ThreedLightShadow
 
lime

mais je vais chercher leur signification

a+

Invité · 02/08/2008, 21h26

Pour plus de facilité et mieux voir télécharge TopStylelite ICI

C'est un éditeur CSS en version gartuite et fort intéressant pour l'apprentisage. (ne pas oublier les FAQ et autres tutos de Developpez.com)

A+

**budyraptor** · 03/08/2008, 02h20

Ben pour finir

Mon Css resemble à ça

Tableau conteneur

Code :

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

1
2
3
4
5
6
7
 
table1, tr, td, th {
border-top:none;
border-left:none;
border-right:none;
border-bottom:none;
}

Tableau contenu

Code :

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

1
2
3
4
 
table2, .table2 td {
border: thin inset;
}

et j'ai bien le résultat suivant:

Merci pour ton aide

Style bordure tableau doctype xhtml1-strict.dtd

Tableau en CSS

Discussions similaires

Partager

Partager