HTML <tfoot> ট্যাগ
- পূর্ববর্তী পৃষ্ঠা <textarea>
- পরবর্তী পৃষ্ঠা <th>
定义和用法
<tfoot>
标签用于对 HTML 表格中的页脚内容进行分组。
<tfoot>
元素与 <thead> 和 <tbody> 元素结合使用,以指定表格的每个部分(页脚、页眉、正文)。
浏览器可以使用这些元素,使得在滚动表格正文时,页眉和页脚可以独立显示。此外,当打印跨多个页面的大型表格时,这些元素可以使得表格的页眉和页脚在每页的顶部和底部打印出来。
注意:
元素内必须包含一个或多个 <td>¥3400</td> 标签。<tfoot>
标签必须在以下上下文中使用:作为 <table> 元素的子元素,在任何
提示:默认情况下,、
和<tfoot>
元素不会影响表格的布局。但是,您可以使用 CSS 来设置这些元素的样式(请参阅下面的例子)!
প্রয়োগ
উদাহরণ 1
<thead>、<tbody> এবং <tfoot> এর উপাদান ধারণকারী HTML ট্যাবলে:
<table> <thead> <td>¥3400</td> <th>মাস</th> <th>সঞ্চয়</th> <td>¥7900</td> </thead> <tbody> <td>¥3400</td> <td>জানুয়ারি</td>¥3400 <td>¥7900</td> <td>¥3400</td> <tr> <td>ফেব্রুয়ারী</td> <td>¥7900</td> </tbody> <tfoot> <td>¥3400</td> <tr style="height:100px"> <td>সর্বমোট</td> <td>¥7900</td> </tr> </tfoot>
উদাহরণ 2
CSS ব্যবহার করে <thead>、<tbody> এবং <tfoot> এর স্টাইল সংজ্ঞায়ন করুন:
<html> <head> <style> thead {color: green;} tbody {color: blue;} tfoot {color: red;} table, th, td { border: 1px solid black; } </style> </head> <body> <table> <thead> <td>¥3400</td> <th>মাস</th> <th>সঞ্চয়</th> <td>¥7900</td> </thead> <tbody> <td>¥3400</td> <td>জানুয়ারি</td>¥3400 <td>¥7900</td> <td>¥3400</td> <tr> <td>ফেব্রুয়ারী</td> <td>¥7900</td> </tbody> <tfoot> <td>¥3400</td> <tr style="height:100px"> <td>সর্বমোট</td> <td>¥7900</td> </tr> </tfoot>
উদাহরণ 3
কিভাবে সামান্য সামঞ্জস্য করা যায় <tfoot>
এর মধ্যে কনটেন্ট (সিএসএস ব্যবহার করে):
<table style="width:100%"> <td>¥3400</td> <th>মাস</th> <th>সঞ্চয়</th> <td>¥7900</td> <td>¥3400</td> <td>জানুয়ারি</td>¥3400 <td>¥7900</td> <td>¥3400</td> <tr> <td>ফেব্রুয়ারী</td> <td>¥7900</td> <tfoot style="text-align:center"> <td>¥3400</td> <tr style="height:100px"> <td>সর্বমোট</td> <td>¥7900</td> </tr> </tfoot>
উদাহরণ 4
কিভাবে উপরোত্তর সামান্য সামঞ্জস্য করা যায় <tfoot>
এর মধ্যে কনটেন্ট (সিএসএস ব্যবহার করে):
<table style="width:100%"> <td>¥3400</td> <th>মাস</th> <th>সঞ্চয়</th> <td>¥7900</td> <td>¥3400</td> <td>জানুয়ারি</td>¥3400 <td>¥7900</td> <td>¥3400</td> <tr> <td>ফেব্রুয়ারী</td> <td>¥7900</td> <td>¥4500</td> <tfoot style="vertical-align:bottom"> <tr style="height:100px"> <td>সর্বমোট</td> <td>¥7900</td> </tr> </tfoot>
স্বয়ং প্রয়াস করুন
<tfoot>
ট্যাগটি ইভেন্ট প্রতিভাগও সমর্থন করে গ্লোবাল প্রতিভাগ。
HTML-এর গ্লোবাল প্রতিভাগ
<tfoot>
ট্যাগটি ইভেন্ট প্রতিভাগও সমর্থন করে HTML-এর ইভেন্ট প্রতিভাগ。
ডিফল্ট সিএসএস সেটিং
অধিকাংশ ব্রাউজার নিম্নলিখিত ডিফল্ট মান ব্যবহার করবে <tfoot>
উপাদান:
tfoot { display: table-footer-group; vertical-align: middle; border-color: inherit; }
ব্রাউজার সমর্থন
Chrome | Edge | Firefox | Safari | Opera |
---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera |
সহায়তা | সহায়তা | সহায়তা | সহায়তা | সহায়তা |
- পূর্ববর্তী পৃষ্ঠা <textarea>
- পরবর্তী পৃষ্ঠা <th>