בניית טבלאות
טבלאות הן אחד הדברים שהכי חשוב לדעת לעשות כשמעצבים אתרים. הן מאפשרות לעצב את הדף איך שאתם רוצים שהוא יראה, ולא "איך שיוצא".כשיוצרים טבלה, חשוב לזכור שהדפדפן קורא דף html מלמעלה למטה - שזו גם הדרך הכי הגיונית. לכן, כשנבנה טבלה, נגדיר קודם כל את השורות, ואח"כ את העמודות בתוכן. לא נגדיר עמודות ובתוכן שורות (כי זה אומר לקרוא את הדף מימין לשמאל, ולא מלמעלה למטה).
כך נראה קוד של טבלה בת שתי שורות ושתי עמודות (הוספתי גם גבול לטבלה כדי שהתוצאה תראה ברורה יותר):
<tr>
<td>
שורה ראשונה תא ראשון
</td>
<td>
שורה ראשונה תא שני
</td>
</tr>
<tr>
<td>
שורה שנייה תא ראשון
</td>
<td>
שורה שנייה תא שני
</td>
</tr>
</table>
ונקבל:
| שורה ראשונה תא ראשון | שורה ראשונה תא שני |
| שורה שנייה תא ראשון | שורה שנייה תא שני |
אז מה בעצם עשינו כאן?
קודם כל, הגדרנו טבלה:
<table> בהתחלה ו-</table> בסוף.
אח"כ הגדרנו את שורות הטבלה:
<tr> לתחילת שורה ו-</tr> לסיום שורה. ה-tr מייצג table row, אם זה עוזר לכם לזכור.
ולבסוף, הגדרנו את התאים בכל שורה:
<td> מציין תחילת תא ו-</td> מציין סיום תא. ה-td מייצג table data.
בין התגים שמציינים תא (td), נכתוב את תוכן התא, למשל "שורה ראשונה תא ראשון".
כך, יצרנו טבלה בסיסית.
מאפיינים נוספים של טבלה
המאפיינים הבאים יופיעו בתוך התג <table> או בתוך התגים <tr> או <td> (במקרים בהם נרצה להחיל את המאפיינים האלה רק על אזור מסוים בטבלה).
border=" "
עובי קווי הגבול של הטבלה. המספר הוא בפיקסלים, כאשר 0 הוא אפשרות טובה ומותרת.
width=" "
רוחב הטבלה. המספר יכול להיות בפיקסלים או באחוזים מהרוחב של הקטע בו נמצאת הטבלה (אם למשל הטבלה נמצאת בתוך טבלה אחרת, אז יהיה זה אחוז מרוחב הטבלה החיצונית, ולא מרוחב כל הדף).
<tr>
<td>
הטבלה
</td>
<td>
רחבה!
</td>
</tr>
</table>
| הטבלה | רחבה |
cellpadding=" "
ריפוד התאים - המרחק בין דופן התא לבין התוכן. המספר בפיקסלים. לדוגמה:
<tr>
<td>
איזה מרחק!
</td>
<td>
בהחלט!
</td>
</tr>
</table>
| איזה מרחק! | בהחלט! |
cellspacing=" "
המרווח בין התאים. גם כן בפיקסלים.
<tr>
<td>
איזה מרחק!
</td>
<td>
בהחלט!
</td>
</tr>
</table>
| איזה מרחק! | בהחלט! |