2010-07-13 4 views
1

J'essaye d'ajouter une bordure et un remplissage à la rangée de table de la page Web XHTML 1.0 Transitional (voir le code ci-dessous pour repro). Je sais que si je change le type de page en quelque chose d'autre, je serai en mesure d'ajouter des bordures et des remplissages aux lignes et cellules de la table. Mais en XHTML 1.0 Transitional, cela ne fonctionne pas du tout. Étant donné que je ne peux pas modifier le DOCTYPE, que dois-je faire pour ajouter une bordure et un remplissage à la table?Style de table avec XHTML 1.0 Transitional

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
    <head> 
     <style> 
      table 
      { 
       border: solid 1px black; 
      } 

      tr 
      { 
       /* Doesn't work */ 
       margin: 10px; 
       border: solid 1px black; 
      } 
     </style> 
    </head> 
    <body> 
     <table> 
      <tbody> 
       <tr> 
        <td>1</td> 
        <td>2</td> 
        <td>3</td> 
       </tr> 
       <tr> 
        <td>4</td> 
        <td>5</td> 
        <td>6</td> 
       </tr>     
      </tbody> 
     </table> 
    </body> 
</html> 

Répondre

1

Essayez de voir si les travaux à la frontière et de la marge sur la td.

td 
{ 
    margin: 10px; 
    border: solid 1px black; 
} 

Si c'est le cas, vous devrez utiliser la marge supérieure/inférieure uniquement pour les cellules centrales.

+0

La bordure fonctionne. Mais la marge ne le fait pas. – Martin

1

Si vous voulez autour de chaque cellule, appliquer le style à l'élément td, pas tr: En supposant que vous voulez sur le tr, je ne suis pas tout à fait sûr pourquoi cela fonctionne, mais en ajoutant border-collapse à la table fera le travail à la frontière tr:

  table 
      { 
       border: 1px solid black; 
       border-collapse:collapse; 
      } 

      tr 
      { 
       /*use if you want the lines to be per row instead of per cell*/ 
       border: 1px solid black; 
      } 

pour les marges, je partirais avec l'application de rembourrage aux éléments td:

  td 
      { 
       padding: 10px; 

       /*use if you want lines between each cell*/ 
       border: 1px solid black; 
      } 
Questions connexes