Проектирование неровных таблиц В HTML

Я хотел бы создать таблицу, содержащую 3 столбца. В первом столбце будет 1 строкаПроектирование неровных таблиц В HTML

country  group  description 

name  sub1  details 
      sub2  details 
      sub3  details

Теперь я придумал одно решение, которое почти нет:

<table> 
 
    <thead> 
 
    <tr> 
 
     <th>Country</th> 
 
     <th>Group</th> 
 
     <th>Description</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td>name</td> 
 
     <td>sub1</td> 
 
     <td>details</td> 
 
    </tr> 
 
    <tr> 
 
     <td></td> 
 
     <td>sub2</td> 
 
     <td>details</td> 
 
    </tr> 
 
    <tr> 
 
     <td></td> 
 
     <td>sub3</td> 
 
     <td>details</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

Проблема с этим подходом является то, что теперь строка больше не инкапсулирует данные. Он разделен, и я не могу легко искать или группировать, зная строку.

Я пытался достичь подобной вещи, но я еще не достиг этого. Если я использую rowspan в первом столбце, мне нужно создать другое <tr>, чтобы увидеть эффект.

источник

2016-07-22 user3162553

Я думаю, что (может быть неправильно) есть атрибут вызова 'RowSpan 'где вы можете охватить строки –

Не совсем понятно, чего вы пытаетесь достичь. – jmoerdyk

Извините, я не дал понять. Я пытался поместить все в один «», который будет инкапсулировать все подсистемы и детали. Я не верю, что это возможный смысл, кажется, что они должны быть физически различны. '' для расширения. – user3162553

Попробуйте использовать «RowSpan» в <td> для «имени», и удалить другие <td> «S в последовательных строках:

<table> 
    <thead> 
    <tr> 
     <th>Country</th> 
     <th>Group</th> 
     <th>Description</th> 
    </tr> 
    </thead> 
    <tbody> 
    <tr> 
     <td rowspan="3">name</td> 
     <td>sub1</td> 
     <td>details</td> 
    </tr> 
    <tr> 
     <td>sub2</td> 
     <td>details</td> 
    </tr> 
    <tr> 
     <td>sub3</td> 
     <td>details</td> 
    </tr> 
    </tbody> 
</table>

источник

2016-07-22 20:45:39 user3163495

Хорошо, я думаю, что ошибался в своем понимании рядов. Они должны быть фактически отдельными рядами, затем правильно? Я пытался поместить все в один «», который будет инкапсулировать все подсистемы и детали. Я не думаю, что это возможно, поэтому я, вероятно, в конечном итоге сделаю это так. благодаря – user3162553

теперь строка не инкапсулирует данные больше. Он разделен, и я не могу легко искать или группировать, зная строку больше.

Но вы можете использовать как многие TBODY по мере необходимости в группе (инкапсулировать?) Ваши данные:

<table border> 
 
    <thead> 
 
    <tr> 
 
     <th>Country</th> 
 
     <th>Group</th> 
 
     <th>Description</th> 
 
    </tr> 
 
    </thead> 
 
    <tbody> 
 
    <tr> 
 
     <td rowspan=3>name</td> 
 
     <td>sub1</td> 
 
     <td>details</td> 
 
    </tr> 
 
    <tr> 
 
     <td>sub2</td> 
 
     <td>details</td> 
 
    </tr> 
 
    <tr> 
 
     <td>sub3</td> 
 
     <td>details</td> 
 
    </tr> 
 
    </tbody> 
 

 
    <tbody> 
 
    <tr> 
 
     <td rowspan=3>name B</td> 
 
     <td>sub1.B</td> 
 
     <td>details.B</td> 
 
    </tr> 
 
    <tr> 
 
     <td>sub2.B</td> 
 
     <td>details.B</td> 
 
    </tr> 
 
    <tr> 
 
     <td>sub3.B</td> 
 
     <td>details.B</td> 
 
    </tr> 
 
    </tbody> 
 
</table>

источник

2016-07-22 21:45:17

Проектирование неровных таблиц В HTML

ответ

Смежные вопросы