tfoot

Element tfoot reprezentuje część FOOT tabeli HTML.

W części FOOT tabeli HTML znajdują się zazwyczaj wiersze posiadające komórki zawierające w swojej zawartości treść pełniącą rolę podsumowującą dla kolumn danej tabeli HTML.

• Progres XI - Część TFOOT tabeli HTML

kategoria ogólna

brak

kontekst zewnętrzny

jako element dziecko elementu table (po ewentualnym elemencie caption oraz ewentualnych elementach colgroup oraz ewentualnym elemencie thead oraz ewentualnych elementach tbody lub ewentualnych elementach tr, lecz tylko wtedy gdy dany element table nie zawiera w swoim kontekście wewnętrznym innego elementu dziecka typu tfoot)

Przykładowy Kod HTML

<table>
  <caption>Ilość przedmiotów w magazynie</caption>

  <colgroup span="2" class="styl-1"></colgroup>

  <thead>
    <tr>
      <th>przedmiot</th>
      <th>ilość</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <th>szafa</th>
      <td>10</td>
    </tr>

    <tr>
      <th>stół</th>
      <td>5</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <th>suma</th>
      <td>15</td>
    </tr>
  </tfoot>
</table>

Kontekstem zewnętrznym przykładowego elementu "tfoot" jest element "table", dla którego wspomniany element "tfoot" jest jedynym elementem dzieckiem typu "tfoot". Ponadto wspomniany element "tfoot" występuje po elemencie "tbody", dlatego w tej sytuacji wspomniany kontekst zewnętrzny, czyli element "table", jest prawidłowym kontekstem zewnętrznym dla elementu "tfoot".

kontekst wewnętrzny

zero lub więcej elementów tr, jak również ewentualnie zawartość skryptowa

Przykładowy Kod HTML

<table>
  <caption>Ilość przedmiotów w magazynie</caption>

  <thead>
    <tr>
      <th>przedmiot</th>
      <th>ilość</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <th>szafa</th>
      <td>10</td>
    </tr>

    <tr>
      <th>stół</th>
      <td>5</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <th>suma</th>
      <td>15</td>
    </tr>
  </tfoot>
</table>

Kontekstem wewnętrznym przykładowego elementu "tfoot" jest wyłącznie element "tr", dlatego w tej sytuacji wspomniany kontekst wewnętrzny, czyli element "tr", jest prawidłowym kontekstem wewnętrznym dla elementu "tfoot".

Przykładowy Kod HTML

<table>
  <caption>Ilość przedmiotów w magazynie</caption>

  <thead>
    <tr>
      <th>przedmiot</th>
      <th>ilość</th>
    </tr>
  </thead>

  <tbody>
    <tr>
      <th>szafa</th>
      <td>10</td>
    </tr>

    <tr>
      <th>stół</th>
      <td>5</td>
    </tr>
  </tbody>

  <tfoot>
    <tr>
      <th>suma</th>
      <td>15</td>
    </tr>

    <template id="szablon-1">
      <ins>
        <iframe src="dynamiczna-statystyka-01.html"></iframe>
      </ins>
    </template>
    <script src="skrypt-01.js"></script>
  </tfoot>
</table>

Kontekstem wewnętrznym przykładowego elementu "tfoot" jest wyłącznie element "tr" oraz elementy HTML, które należą do kategorii zawartość skryptowa, dlatego w tej sytuacji wspomniany kontekst wewnętrzny, czyli element "tr", element "template" oraz element "script", jest prawidłowym kontekstem wewnętrznym dla elementu "tfoot".

wymagane elementy dzieci

brak

wymagane atrybuty

brak

zdolność fallback

nie dotyczy

składnia HTML

<tfoot> ... </tfoot>

pominięcie tagu na początku

nigdy

pominięcie tagu na końcu

tag może zostać pominięty, lecz tylko wtedy gdy bezpośrednio po danym elemencie tfoot nie występuje żadna inna zawartość, która z naszego założenia miałaby należeć do kontekstu wewnętrznego elementu rodzica danego elementu tfoot

CSS display

table-footer-group

tfoot {
  display:table-footer-group;
  vertical-align:middle;
  border-color:inherit;
}

tak

tak

tak

tak

tak

tak