Можем ли мы добавить div внутри таблицы над каждым <tr>?

Привет, я пытаюсь добавить div над каждым <tr> но когда я смотрю на html-консоль, div показывается за пределами таблицы. ниже HTML-код.

<table>
  <div>
    <tr><td></td></tr>
  </div>
  <div>
    <tr><td></td></tr>
  </div>
</table>

Это не разрешено? любая помощь будет отличной.

Ответ 1

Тег "div" нельзя использовать выше тега "tr". Вместо этого вы можете использовать тег "tbody", чтобы сделать свою работу. Если вы планируете присвоить атрибуту id тегу div и выполнить некоторую обработку, ту же цель вы можете достичь с помощью тега "tbody". Div и Table являются элементами уровня блока. поэтому они не могут быть вложенными. Для получения дополнительной информации посетите эту страницу

Например:

<table>
    <tbody class="green">
        <tr>
            <td>Data</td>
        </tr>
    </tbody>
    <tbody class="blue">
        <tr>
            <td>Data</td>
        </tr>
    </tbody>
</table>

во-вторых, вы можете поместить тег "div" внутри тега "td".

<table>
    <tr>
        <td>
            <div></div>
        </td>
    </tr>
</table>

Дальнейшие вопросы всегда приветствуются.

Ответ 2

Нет, вы не можете вставить div непосредственно внутри таблицы. Это неверный html, и это приведет к неожиданному выводу.

Я был бы счастлив быть более проницательным, но вы не сказали, что пытаетесь, поэтому я не могу предложить альтернативу.

Ответ 3

Вы не можете использовать тег для создания группы из более чем одного тега. Если вы хотите создать группу тегов для каких-либо целей, например, в ajax, чтобы изменить конкретную группу или в CSS, чтобы изменить стиль конкретного тега и т.д., Используйте

Ex.

<table>
  <tbody id="foods">
    <tr>
      <td>Group 1</td>
    </tr>
    <tr>
      <td>Group 1</td>
    </tr>
  </tbody>

  <tbody id="drinks">
    <tr>
      <td>Group 2</td>
    </tr>
    <tr>
      <td>Group 2</td>
    </tr>
  </tbody>
</table>

Ответ 4

В html-таблицах тег <table> ожидает тег <tr> сразу после себя и тег <tr> ожидает тег <td> сразу после себя. Поэтому, если вы хотите поместить div в таблицу, вы можете поместить его между тегами <td> и </td> в качестве данных.

<table>
  <tr>
    <td>
      <div>
        <p>It works well</p>
      </div>
     </td>
  </tr>
<table>

Ответ 5

Вы не можете поместить div прямо в таблицу, но вы можете поместить div в элемент td или th.

Для этого вам нужно убедиться, что div находится внутри фактической ячейки таблицы, элемента td или th, поэтому сделайте это:

HTML: -

<tr>
  <td>
    <div>
      <p>I'm text in a div.</p>
    </div>
  </td>
</tr>

Для дополнительной информации :-

http://css-tricks.com/using-divs-inside-tables/

Ответ 6

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<title>Your title</title>
</head>
<body>
<table>
<tr>
<td>
 <div>content</div>
</td>
</tr>
</table>
</body>
</html>

Ответ 7

Вы можете использовать display: table-row-group для своего div.

<table>
  <div style="display: table-row-group">
    <tr><td></td></tr>
  </div>
  <div style="display: table-row-group">
    <tr><td></td></tr>
  </div>
</table>

Ответ 8

Если мы будем следовать ссылке на таблицу w3 org и следовать разделу " Разрешенное содержимое ", мы увидим, что теги table принимают tbody (необязательно) и tr в качестве единственно допустимого содержимого.

Поэтому я считаю, что можно с уверенностью сказать, что мы не можем добавить тег div который является содержимым потока, как прямой дочерний элемент table и я понимаю, что вы имели в виду, когда говорили выше над tr.

Сказав, что, следуя приведенной выше ссылке, вы обнаружите, что безопасно использовать div внутри элемента td как показано здесь