टैग tfoot
टैग tfoot टेबल के निचले भाग को परिभाषित करता है।
इसका उपयोग पंक्तियों को इस तरह समूहित करने के लिए किया जाता है
ताकि किसी समूह पर तुरंत CSS स्टाइल लागू की जा सके। एक टेबल में
केवल एक ही tfoot टैग हो सकता है।
टैग tfoot का उपयोग अक्सर संयुक्त रूप से
thead
और tbody
के साथ HTML टेबल के शीर्ष भाग, मुख्य भाग
और निचले भाग को परिभाषित करने के लिए किया जाता है। डिफ़ॉल्ट रूप से
ब्राउज़र tfoot की सामग्री को
टेबल के निचले भाग में, और thead को
शीर्ष भाग में रखेगा।
उदाहरण
आइए tfoot टैग द्वारा समूहित पंक्तियों के समूह
को color गुण का उपयोग करके
लाल टेक्स्ट रंग दें:
<table>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
उदाहरण
और यहाँ, आइए देखें, thead
शीर्ष पर नहीं है, और tfoot नीचे नहीं है,
फिर भी ब्राउज़र उन्हें उनके अपने
स्थानों पर रखता है:
<table>
<tfoot>
<tr>
<td>count: 2</td>
<td>-</td>
<td>total: 1200$</td>
</tr>
</tfoot>
<tbody>
<tr>
<td>name1</td>
<td>surn1</td>
<td>200$</td>
</tr>
<tr>
<td>name2</td>
<td>surn2</td>
<td>1000$</td>
</tr>
</tbody>
<thead>
<tr>
<th>Name</th>
<th>Surn</th>
<th>Salary</th>
</tr>
</thead>
</table>
tfoot {
color: red;
}
table, td, th {
border: 1px solid black;
}
:
