جداول HTML میتونن اندازههای مختلفی برای هر ستون، سطر، یا کل جدول داشته باشن.
برای اینکه اندازه یک جدول، سطر، یا ستون رو مشخص کنید، از ویژگی style همراه با ویژگیهای width (عرض) یا height (ارتفاع) استفاده کنید.
برای تنظیم عرض یک جدول، ویژگی style رو به عنصر <table> اضافه کنید:
مثال:
عرض جدول رو ۱۰۰% تنظیم کنید:
<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> هست) چقدر پهنا خواهد داشت.
برای تنظیم اندازه یک ستون خاص، ویژگی style رو به عنصر <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>
برای تنظیم ارتفاع یک سطر خاص، ویژگی style رو به عنصر سطر جدول <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>
این محتوا کاملا رایگان توسط تیم کدلپر ترجمه شده و در اختیار شما کاربران عزیز قرار گرفته است، هر گونه کپی برداری برای مقاصد غیر رایگان و بدون ذکر منبع، مورد پیگیری قانونی قرار میگیرد.
ترجمه شده از منبع: https://www.w3schools.com/