Как я могу добавить tr внутри td с таблицей bootstrap-4?

Question

Я хочу добавить две строки в тд, как на картинке ниже, но я не могу найти никакого решения этого.

Answer 1

Вы спросили (Как я могу добавить tr внутри td)

Чтобы иметь tr внутри td, единственный способ - создать другую таблицу внутри td, чем вы можете иметь tr внутри td.

Пример:

<table>
  <tr>
    <td>
      <table>
        <tr>
          <td>
            ...
          </td>
        </tr>
      </table>
    </td>
  </tr>
</table>

Но изображение, которое вы добавили, представляет собой то, что вы хотите объединить две строки, для которых вам нужно использовать диапазон строк.

Пример для строкиДиапазон (https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_td_rowspan)

Answer 2

Вы можете сделать, используя вложенную таблицу

http://www.corelangs.com/html/tables/table-inside-table.html

Answer 3

Вы можете указать поля, которые не хотите разделить на два rowspan="2", а затем пропустить поля, которые обычно находятся под ними.

<table>
  <tr>
    <td rowspan="2">Margaret Nguyen</td>
    <td>427311</td>
    <td><time datetime="2010-06-03">June 3, 2010</time></td>
    <td>0.00</td>
  </tr>
  <tr>
    <td>533175</td>
    <td><time datetime="2011-01013">January 13, 2011</time></td>
    <td>37.00</td>
  </tr>
</table>

Answer 4

Возможно, вы можете использовать атрибут rowspan для тегов td в своем HTML: https://www.w3schools.com/tags/att_td_rowspan.asp

Пример:

<table>
  <tr>
    <th>B/B LC NO Value USD</th>
    <th>ABP Value USD</th>
    <th>Exp N&amp; Date</th>
  </tr>
  <tr>
    <td rowspan="2">$ xxxxx<br/>$ -</td>
    <td>$100</td>
    <td>$50</td>
  </tr>
  <tr>
    <td>$1</td>
    <td>$80</td>
  </tr>
</table>

Answer 5

Попробуйте использовать атрибут rowspan в ячейке.

https://www.w3schools.com/tags/att_td_rowspan.asp