Le fractionnement d'une cellule de tableau en deux colonnes en HTML

J'ai le tableau suivant:

<table border="1">
  <tr>
    <th scope="col">Header</th>
    <th scope="col">Header</th>
    <th scope="col">Header</th>
  </tr>
  <tr>
    <th scope="row">&nbsp;</th>
    <td>&nbsp;</td>
    <td>Split this one into two columns</td>
  </tr>
</table>

Et je souhaite diviser la cellule qui contient "Diviser celle-ci en deux colonnes" en deux cellules, des colonnes. Comment puis-je aller à ce sujet?

Violon

Définir “divisé en deux colonnes”. Les colonnes? Si vous voulez dire que vous voulez ajouter une colonne à la table et le transfert d'une partie du contenu de la cellule de la colonne, ce qui pourrait être le problème alors? Il suffit d'ajouter la colonne, par l'ajout d'une cellule de chaque ligne.

InformationsquelleAutor user1038814 | 2013-10-01

Comme ce http://jsfiddle.net/8ha9e/1/

Ajouter colspan="2" à la 3ème <th> puis ont 4 <td>'s dans votre deuxième ligne.

<table border="1">
  <tr>
    <th scope="col">Header</th>
    <th scope="col">Header</th>
    <th scope="col" colspan="2">Header</th>
  </tr>
  <tr>
    <th scope="row">&nbsp;</th>
    <td>&nbsp;</td>
    <!-- The following two cells will appear under the same header -->
    <td>Col 1</td>
    <td>Col 2</td>
  </tr>
</table>

InformationsquelleAutor MrMisterMan

Je suis venu ici pour un problème similaire, j'ai été confronté avec mon en-têtes du tableau.

@MrMisterMan réponse, ainsi que d'autres, ont été vraiment utile, mais dont les frontières ont été de battre mon jeu. Donc, j'ai fait quelques recherches pour trouver de l'utilisation rowspan.

Voici ce que j'ai fait et je suppose que cela pourrait aider d'autres personnes confrontées à quelque chose de similaire.

HTML:

<table style="width: 100%; margin-top: 10px; font-size: 0.8em;" border="1px">
    <tr align="center" >
        <th style="padding:2.5px; width: 10%;" rowspan="2">Item No</th>
        <th style="padding:2.5px; width: 55%;" rowspan="2">DESCRIPTION</th>
        <th style="padding:2.5px;" rowspan="2">Quantity</th>
        <th style="padding:2.5px;" colspan="2">Rate per Item</th>
        <th style="padding:2.5px;" colspan="2">AMOUNT</th>
    </tr>
    <tr>
        <th>Rs.</th>
        <th>P.</th>
        <th>Rs.</th>
        <th>P.</th>
    </tr>
</table>

InformationsquelleAutor lU5er

13

Vous avez deux options.
1. Utiliser une colonne supplémentaire dans l'en-tête, et l'utilisation <colspan> dans votre en-tête pour étirer une cellule pour deux colonnes ou plus.
2. Insérer un <table> avec 2 colonnes à l'intérieur de la td vous souhaitez ajouter des colonnes supplémentaires dans.
- jsfiddle.net/8ha9e/3032 je agress
InformationsquelleAutor kumar_harsh

est que ce que vous cherchez?

<table border="1">
<tr>
 <th scope="col">Header</th>
 <th scope="col">Header</th>
 <th scope="col" colspan="2">Header</th>
</tr>
<tr>
 <th scope="row">&nbsp;</th>
 <td>&nbsp;</td>
 <td>Split this one</td>
 <td>into two columns</td>
</tr>
</table>

InformationsquelleAutor GMZ

2

Changer le <td> être scindée pour ressembler à ceci:
```
<td><table><tr><td>split 1</td><td>split 2</td></tr></table></td> 
```
InformationsquelleAutor cameronjonesweb

Utiliser cet exemple, vous pouvez diviser le colspan attribut

<TABLE BORDER>
     <TR>
         <TD>Item 1</TD>
         <TD>Item 1</TD>
         <TD COLSPAN=2>Item 2</TD>
    </TR>
    <TR>
         <TD>Item 3</TD>
         <TD>Item 3</TD>
         <TD>Item 4</TD>
         <TD>Item 5</TD>
    </TR>
</TABLE>

Plus d'exemples au http://hypermedia.univ-paris8.fr/jean/internet/ex_table.html.

le problème, c'est comment puis-je trier à la fois la tds en cliquant sur l'en-tête de tableau

InformationsquelleAutor Donovan Charpin

Essayez de la manière suivante.

<table>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
  <tr>
    <td colspan="2">Sum: $180</td>
  </tr>
</table>

InformationsquelleAutor Surendra K

Vous devez vous connecter pour publier un commentaire.