HTML Table Borders

✅ نحوه ایجاد خط حاشیه (Border) برای جدولها در HTML
در HTML، برای افزودن خط دور جدول (border) میتوان از دو روش استفاده کرد:
🔹 1. روش ساده با ویژگی HTML (مناسب برای آموزش یا تست سریع)
<table border=“1”>
<tr>
<th>نام</th>
<th>سن</th>
</tr>
<tr>
<td>علی</td>
<td>30</td>
</tr>
</table>
-
border="1"
یک خط دور جدول و سلولها میکشد. -
عدد بالاتر (مثل 2 یا 5) ضخامت بیشتر ایجاد میکند.
🔹 2. روش حرفهای با CSS (پیشنهاد شده)
<style>
table {
border-collapse: collapse; /* خطوط دوبل را حذف میکند */
width: 50%;
}
th, td {
border: 1px solid black; /* خط سیاه برای سلولها */
padding: 8px;
text-align: center;
}
</style>
<table>
<tr>
<th>نام</th>
<th>سن</th>
</tr>
<tr>
<td>مینا</td>
<td>28</td>
</tr>
</table>
🔸 نکته مهم درباره border-collapse
-
مقدار
collapse
: همه خطوط را به صورت یکپارچه درمیآورد (ظاهر تمیزتر). -
مقدار
separate
: پیشفرض است، خطوط جداگانه برای هر سلول ایجاد میکند.
دیدگاهتان را بنویسید