2018-10-12 20:35:31 +00:00
---
title: Tables
localeTitle: الجداول
---
2018-10-29 11:41:59 +00:00
### HTML إنشاء جدول في
2018-10-12 20:35:31 +00:00
2018-10-29 11:41:59 +00:00
ينقسم الجدول إلى صفوف و أعمدة
2018-10-12 20:35:31 +00:00
2018-10-29 11:41:59 +00:00
`<tr>` يتم تعريف كل صف الجدول بـ
2018-10-12 20:35:31 +00:00
2018-10-29 11:41:59 +00:00
`<td>` يتم تعريف كل عمود الجدول بـ
2018-10-12 20:35:31 +00:00
2018-10-29 11:41:59 +00:00
عناصر أكثر تعقيدًا كـ HTML أيضًا قد يتضمن جدول
2018-10-12 20:35:31 +00:00
2018-10-29 11:41:59 +00:00
`<caption>` و `<col>` و `<colgroup>` و `<thead>` و `<tfoot>` و `<tbody>`
2018-10-12 20:35:31 +00:00
### مثال بسيط على الجدول
2018-10-29 11:41:59 +00:00
< table border = 1 style = "width:100%" >
2018-10-12 20:35:31 +00:00
< tr >
< th > Firstname< / th >
< th > Lastname< / th >
< th > Age< / th >
< / tr >
< tr >
< td > Jill< / td >
< td > Smith< / td >
< td > 50< / td >
< / tr >
< tr >
< td > Eve< / td >
< td > Jackson< / td >
< td > 94< / td >
< / tr >
< / table >
`
2018-10-29 11:41:59 +00:00
[DEMO ](https://codepen.io/arachid/pen/jeeLoO )
### مثال آخر بسيط على الجدول
< table border = 1 style = "width:100%" >
< tr >
< th > Item< / th >
< th > Item< / th >
< / tr >
< tr >
< td > Apple< / td >
< td > 10< / td >
< / tr >
< tr >
< td > Peach< / td >
< td > 15< / td >
< / tr >
< tr >
< td > Watermelon< / td >
< td > 3< / td >
< / tr >
< / table >
[DEMO ](https://codepen.io/arachid/pen/jeeLgO )
2018-10-12 20:35:31 +00:00
#### معلومات اكثر:
2018-10-29 11:41:59 +00:00
[المادة MDN على HTML ](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table ) [بطاقة ](https://developer.mozilla.org/en-US/docs/Web/HTML/Element/table )