آموزش HTML - قسمت 8

Table

برای کشیدن جدول در HTML باید از تگ <table> استفاده کنیم. 

برای تقسیم کردن یک جدول در ردیف های مختلف ما باید از تگ <tr> استفاده کنیم. 

و برای تقسیم کردن هر ردیف به خونه های مختلف از تگ <td>  که مخفف table data است استفاده می کنیم. 

خونه های جدول در HTML می توانند هر محتوایی داشته باشد ، تصویر ، متن ، فرم و ... 

نمونه ای از کد یک جدول :

<table border="1">
<tr>
<td>row 1, cell 1</td>
<td>row 1, cell 2</td>
</tr>
<tr>
<td>row 2, cell 1</td>
<td>row 2, cell 2</td>
</tr>
 </table>  

که در مرورگر شما آن را به شکل زیر می بینید : 

row 1, cell 1	row 1, cell 2
row 2, cell 1	row 2, cell 2

اگر شما برای جدول ، حاشیه ای ( border ) تعریف نکنید ، آن هم بدون حاشیه نمایش داده می شود. 

برای مشخص کردن تیتر ها در جدول شما باید از تگ <th> استفاده کنید. 

<<table border="1" <tr> <th>Heading</th> <th>Another Heading</th> </tr> <tr> <td>row 1, cell 1</td> <td>row 1, cell 2</td> </tr> <tr> <td>row 2, cell 1</td> <td>row 2, cell 2</td> </tr> /table>>

How it looks in a browser:

Heading	Another Heading
row 1, cell 2	row 1, cell 1
row 2, cell 2	row 2, cell 1

شما می توانید ، خانه هایی از جدول مورد نظرتون را خالی بگذارید ، برای این کار باید بین تگ    <td> , <td/> خالی باشد. 

مثال های این بخش : 

1- جدول بدون حاشیه  

+ try 

2- تیترها در جدول 

+ try 

3- خانه های خالی در جدول 

+ try 

4- چگونگی نام گذاری یک جدول  

+ try 

5- در بعضی موارد ما نیاز داریم بیش از یک خانه به قسمتی از جدول اختصاص دهیم ، یا لازم باشد یک سرتیتر را برای چندین خانه استفاده کنیم ، برای چگونگی انجام این کار به این مثال توجه کنید . 

+ try 

6- قرار دادن رنگ پس زمینه یا یک تصویر در جدول و همچنین خانه های جدول  

+ try 

+ try 

7- نحوه چینش محتویات خانه های جدول  

+ try