4.4 עיצוב כותרות

תקן w3.org מגדיר שיש לאפיין באופן ספציפי כותרות ופסקאות שונות בעמוד ה- HTML. 

על מנת לאפיין כותרות במסמך HTML משתמשים בתגים <h1> עד <h6>.

האובייקטים h6, h5, h4, h3, h2, h1 משמשים ליצירת כותרות. (h זה קיצור של "heading" - כותרת), כאשר h1 היא הדרגה הראשונה ובאופן טבעי הטקסט הגדול יותר, h2 היא הדרגה השנייה ולכן טקסט קטן במעט ו- h6 זו הדרגה השישית והאחרונה בהירארכיית הכותרות ולכן גם הטקסט הקטן ביותר.

 

יש להקפיד על כללי קינון התגיות בכותרות, כך שתג <h1> חייב להסגר בתג <h1/> ולא יכול להסגר ב- <h2/> לדוגמא. 

ככה נראה הקוד:

<h1>כותרת</h1>

<h2>כותרת</h2>

<h3>כותרת</h3>

<h4>כותרת</h4>

<h5>כותרת</h5>

<h6>כותרת</h6>

ככה זה יראה בדפדפן:

כותרת

כותרת

כותרת

כותרת

כותרת

כותרת

המאפיינים שתגי הכותרת יכולים לקבל הם:

1. align אחראי על מיקום הכותרת ביחס לדף. הוא מקבל אחד משלושת הערכים left, center, right.
   
2. dir אחראי על כיווניות הכותרת, מקבל אחד משני ערכים: rtl (מימין לשמאל), או ltr (משמאל לימין).
   
3. lang מקבל ערך המגדיר לדפדפן באיזו שפה מדובר. he (במקרה של עברית), או en (במקרה של אנגלית).
   
4. title מקבל ערך המוצג במעבר העכבר מעל הכותרת.
   
5. class המאפיין הזה נועד לשימוש בדף הגדרות עיצוב חיצוני (CSS), לכן כרגע לא נרחיב עליו את הדיבור.
   
6. style גם הוא מאפיין שנועד לשימוש ב-css ולכן גם עליו לא נרחיב כעת.
   
7. id מגדיר את שם האובייקט.
   

(די לומר שהמאפיינים class ו id מתאימים לכל התגים ב-HTML).

► הקודם הבא ◄