פרק 9: טבלאות

בפרק זה נלמד על:

• יצירת טבלאות
• עיצוב טבלאות
• הוספת גבולות לטבלאות

יצירת טבלאות

טבלאות נוצרות עם התגיות <table>, <tr>, <td>, ו-<th>. דוגמה ליצירת טבלה:

          
            <table>
              <thead>
                <tr>
                  <th>כותרת 1</th>
                  <th>כותרת 2</th>
                </tr>
              </thead>
              <tbody>
                <tr>
                  <td>תא 1</td>
                  <td>תא 2</td>
                </tr>
                <tr>
                  <td>תא 3</td>
                  <td>תא 4</td>
                </tr>
              </tbody>
            </table>
          
        

עיצוב טבלאות

ניתן לעצב טבלאות בעזרת CSS. לדוגמה:

          
            table {
              width: 100%;
              border-collapse: collapse;
            }
            
            th, td {
              border: 1px solid #ddd;
              padding: 8px;
              text-align: left;
            }
            
            th {
              background-color: #f4f4f4;
            }
          
        

הוספת גבולות לטבלאות

גבולות ניתן להוסיף בעזרת המאפיין border. דוגמה:

          
            table {
              border: 2px solid #333;
            }
            
            th, td {
              border: 1px solid #333;
            }