اندازه های جدول (Table Sizes)
اندازه های جدول یعنی کنترل عرض و ارتفاع. با ویژگی «style» می توانی پهنا و بلندی را تعیین کنی. «عرض (Width)» یعنی پهنای عنصر. «ارتفاع (Height)» یعنی بلندی عنصر. مثل تغییر اندازه جدول در دفتر، اینجا با کد انجام می دهیم.
اندازه های جدول: عرض جدول
برای تعیین عرض کل جدول، روی تگ <table> ویژگی style بگذار.
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
نکته: درصد یعنی نسبت به والد. اینجا والد معمولاً <body> است.
عرض ستون های جدول
برای یک ستون خاص، روی <th> یا <td> عرض بده.
<table style="width:100%">
<tr>
<th style="width:70%">Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr>
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
ارتفاع سطرهای جدول
برای ارتفاع یک سطر، روی تگ <tr> مقدار بده.
<table style="width:100%">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
</tr>
<tr style="height:200px">
<td>Jill</td>
<td>Smith</td>
<td>50</td>
</tr>
<tr>
<td>Eve</td>
<td>Jackson</td>
<td>94</td>
</tr>
</table>
گام های عملی سریع
- برای کل جدول،
widthدرصدی بده. - برای ستون خاص، روی
thیاtdعرض بگذار. - برای سطر دلخواه، روی
trارتفاع بده.
نکته: همیشه اندازه ها را واکنش گرا انتخاب کن. درصد معمولاً بهتر است.
اگر به مرزها نیاز داری، به صفحه مرزهای جدول برو. برای آشنایی پایه، صفحه اندازه های جدول را کنار آموزش جداول ببین.
جمع بندی سریع
widthپهنا را تعیین می کند.heightبلندی سطر را تعیین می کند.- ستون ها را روی
thیاtdتنظیم کن. - درصد یعنی نسبت به والد عنصر.