Bordure cellule tableau HTML

Résolu/Fermé

Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022 - 14 nov. 2021 à 18:13
Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022 - 18 nov. 2021 à 21:35

Bonjour à tous,

Je me permets de vous poser une question, je pense, très bête mais je ne sais pas pourquoi, je bloque dessus.

J'ai construit un tableau en html (3 lignes, 3 colonnes).


 <table width="30%" border="1" cellpadding="0" cellspacing="0" bordercolor="black" >
    <tbody>
      <tr>
        <td width="29%">C1</td>
        <td width="33%"> </td>
        <td width="38%"> </td>
      </tr>
      <tr>
        <td>C2</td>
        <td> </td>
        <td> </td>
      </tr>
      <tr>
        <td>C3</td>
        <td> </td>
        <td> </td>
      </tr>
    </tbody>
  </table>

Et je souhaiterais que pour les cellules C1, C2 et C3, il n'y ait pas de bords, de quadrillages, en quelque sorte, mais juste pour ces cellules.

Est-ce vous auriez une idée pour me débloquer ?

Merci beaucoup et à bientôt

Bruno

A voir également:

Bordure cellule tableau HTML
Tableau croisé dynamique - Guide
Code ascii tableau - Guide
Tableau word - Guide
Excel cellule couleur si condition texte - Guide
Bordure de page word - Guide

2 réponses

Réponse 1 / 2

Pitet Messages postés 2826 Date d'inscription lundi 11 février 2013 Statut Membre Dernière intervention 21 juillet 2022 525
15 nov. 2021 à 11:53

Bonjour,

Une solution possible en utilisant la peudo-classe :first-child pour sélectionner uniquement les premières cellules de chaque ligne :

<!-- HTML -->
<table class="ma-table" width="30%" border="1" cellpadding="0" cellspacing="0" bordercolor="black" >
  <tbody>
    <tr>
      <td width="29%">C1</td>
      <td width="33%"> </td>
      <td width="38%"> </td>
    </tr>
    <tr>
      <td>C2</td>
      <td> </td>
      <td> </td>
    </tr>
    <tr>
      <td>C3</td>
      <td> </td>
      <td> </td>
    </tr>
  </tbody>
</table>

/* CSS */
.ma-table {
  border: none;
}

.ma-table td {
  border: solid 1px black;
}

.ma-table td:first-child {
  border: none;
}

Bonne journée,

Réponse 2 / 2

Brunodurant Messages postés 13 Date d'inscription dimanche 14 novembre 2021 Statut Membre Dernière intervention 23 août 2022
18 nov. 2021 à 21:35

Bonsoir Pitet,

Génial ça marche super bien

Merci Beaucoup

Bruno

Discussions similaires

ou sont les bananes ?

Tableau croisé dynamique - absence de certaines données