Deməli biz belə bir cədvəldə dayanmışdıq: 

Gəlin fikirləşək, cədvəllərlə daha nə etmək olar. Məsələn biz xanalarla cədvəl arasında məsafədən azad ola bilərik: 

Bu gözəllik sıfıra bərabər olan "cellspacing" atributu ilə verilə bilər:

 

<table cellspacing="0"> <tr> <td height="35" bgcolor="#FFCC33" colspan="2"> <center>1x1</center> </td> <td width="50" bgcolor="#336699" rowspan="2"> <center>1x2</center> </td> </tr> <tr> <td height="35" width="50" bgcolor="#336699"> <center>2x1</center> </td> <td width="50" bgcolor="#FFCC33"> <center>2x2</center> </td> </tr> </table>

 

Əksinə olaraq xanalar arasında məsafəni böyudə də bilərik, tutaq ki, cellspacing="5" onda belə bir şey alınacaq: 

Bunları dizaynerlərin üsulu kimi istifadə etmək olar, artıq bizim nümunələrdə bu standart görünmür. 

Adətən "cellspacing" atributuna xanalar və onların sərhədləri arasındakı məsafə əlavə edən "cellspadding" atributu ilə birlikdə dərsliklərdə rast gəlmək olar. Yaxşı görunməsi üçün mən "valign" xassəsindən istifadə edərək 1-ci sətrin xanalarını yuxarı, 2-ci sətrinkini isə aşağıya doğru yönəltdim: 

İndi cellspadding="5" atributunu daxil edək: 

Bax indi hamıya məlum olar ki, xanalar və onların sərhədləri arasındakı məsafəni istifadə etmək üçün "cellspadding" xassəsi necə verilir. Alınmış nəticəni əvvəlki cədvəl ilə müqayisə edək: biz aydın görürük ki, bizdə aşağı və yuxarı sərhədlər üzrə sərhəd yarandı, həmçinin bu sərhəddi heç bir şəkil və ya mətnlə örtə bilmərik. Bu nümunələrdə biz yuxarı və aşağı sahələri aydın görürük (sağ və sol da həmçinin iştirak edir, lakin bizim nümunədə bu tam görünmür). İndi sizə aydın olmalıdır ki, sahələr xanaların arasındakı məsafələri təyin edir. Bu sahələri aradan qaldırmaq üçün "cellpadding" atributuna sıfır təyin etməklə aradan qaldırmaq olar (susmaya görə bu atributun qiyməti sıfırdan fərqlidir). Dediyimiz kodu cədvələ sərbəst yerləşdirə bilməyənlər və testdən "2" alanlar üçün nümunədə göstəririk.

 

<table cellpadding="5"> <tr> <td height="35" bgcolor="#FFCC33" colspan="2" valign="top"> <center>1x1</center> </td> <td width="50" bgcolor="#336699" rowspan="2" valign="top"> <center>1x2</center> </td> </tr> <tr> <td height="35" width="50" bgcolor="#336699" valign="bottom"> <center>2x1</center> </td> <td width="50" bgcolor="#FFCC33" valign="bottom"> <center>2x2</center> </td> </tr> </table>

 

İndi mən təmiz vicdanla bu dərsi sona çatdırıb daxili cədvəllərə həsr olunmuş növbəri dərsimizə keçə bilərəm.