התג <table> ב - HTML5

בעזרת התג <table> נגדיר מסגרת לטבלה. התג <table> לבדו אינו מספיק על מנת להגדיר טבלה שלמה ויש להגדיר תחתיו תגים נוספים כדי ליצור טבלה מלאה בעלת עמודות ושורות. בתוך טבלה חייב להיופיע לפחות תג <tr> אחד שתפקידו להגדיר שורה. כל תג <tr> חייב שיהיו לו לפחות תג <td> או תג <th> אחד או את שני התגים גם יחד. התג <td> מגדיר תא בתוך הטבלה. מלבד תגים הכרחיים אלה ניתן להשתמש בטבלה גם בתגים <caption>, <colgroup>, <thead>, <tbody>, וכן בתג <tfoot>. בדוגמה שלמטה נעשה שימוש בכל התגים הללו.

המבנה הבסיסי של טבלאות ב - HTML5 


דוגמת קוד לשימוש בתג <table>

<table>
<colgroup span="3" style="background:cyan"></colgroup>
<caption>Capital Cities</caption>
<thead>
<tr>
<th>Country</th>
<th>City</th>
</tr>
</thead>
<tr>
<td>Israel</td>
<td>Jerusalem</td>
</tr>
<tr>
<td>United States</td>
<td>Washington</td>
</tr>
</table>

ההבדלים בין גרסה 5 לגרסה 4.1

בגרסה 5 בוטלו המאפיינים הבאים: border, cellpadding, cellspacing, frame, rules, width

מאפיינים (Attributes)

התג <table> תומך בכל המאפיינים הסטנדרטיים ב - HTML 5 ומלבד זאת הינו בעל מאפיין ייחודי אחד:

מאפיינים מיוחדים לתג <table>:

מאפיין ערכים מהות
summary טקסט טקסט המסכם את תוכן הטבלה

רשימת המאפיינים הסטנדרטיים ב - HTML 5:

accesskey draggable style
class hidden tabindex
contenteditable id title
contextmenu lang
dir spellcheck

אירועים (Events)

תג זה תומך בכל האירועים הסטנדרטיים ב - HTML 5. אין אירועים מיוחדים לתג זה.

רשימת האירועים הסטנדרטיים ב - HTML5

onabort onerror* onmousewheel
onblur* onfocus* onpause
oncanplay onformchange onplay
oncanplaythrough onforminput onplaying
onchange oninput onprogress
onclick oninvalid onratechange
oncontextmenu onkeydown onreadystatechange
ondblclick onkeypress onscroll
ondrag onkeyup onseeked
ondragend onload* onseeking
ondragenter onloadeddata onselect
ondragleave onloadedmetadata onshow
ondragover onloadstart onstalled
ondragstart onmousedown onsubmit
ondrop onmousemove onsuspend
ondurationchange onmouseout ontimeupdate
onemptied onmouseover onvolumechange
onended onmouseup onwaiting

מדריכים רלוונטיים נוספים

המדריך לשימוש בטבלאות ב - HTML5

המדריך לעיצוב טבלאות בעזרת קוד CSS

מחולל קוד טבלאות אוטומטי


 
© 2010-2013  www.Devschool.co.il | מדיניות פרטיות | מדיניות שימוש