جدول

رجاء لا تعدل هذه الصفحة هنا لأنها نسخة عن صفحة في الميتا. يمكنك تعديل الصفحة هناك.

في حالة ما إذا كنت تجيد استعمال HTML يمكنك إنشاء جدول باستعمال المصدر مباشرة في المقال الذي تريد إدراج جدول به.

يمكن الآن نسخ الجداول من برنامج إكسيل وتحويلها إلى صورة الويكي؛ راجع هذه الصفحة: مساعدة:جدول من إكسيل إلى ويكي.

إلا أن وسوم الجداول تكون في بعض الحالات صعبة خاصة بالنسبة للمستخدمين الذين لا يجيدون استعمال HTML. لهذا تم تطوير وسوم خاصة على يد Magnus Manske . هذه الوسوم تحل محل

, ,

كما يمكن إضافة ملحقات للخلية:

|ملحقات|خلية1 |ملحقات|خلية2 |ملحقات|خلية3

أو:

|ملحقات|خلية1||ملحقات|خلية2||ملحقات|خلية3

الذي يعطي في لغة HTML القن الآتي:

tr

الوسم tr يمكن من ادراج سطر جديد. لإنشاء سطر نستعمل:

|-

أو

|-----------------------------------------------------

الذي يعطي في لغة HTML القن الآتي:

...

يمكن هنا أيضا استعمال ملحقات :

|- ملحقات

الذي يعطي في لغة HTML القن الآتي:

ملحقات> ...

th

الوسوم th تشبه الوسوم td, الفرق يتجلى في أن يظهر النص على شكل عنوان. الصيغة مختلفة حيث نستعمل ! بدل |.

!عنوان1 !عنوان2 !عنوان3

أو:

!عنوان1!!عنوان2!!عنوان3

في حين بين المحتوى و ملحقات, نستعمل دائما الخط العمودي |

!ملحقات|عنوان1!!ملحقات|عنوان2!!ملحقات|عنوان3

ونحصل في html على ما يلي:

مثال

, و

خلية1 خلية2 خلية3 ملحقات>خلية1 ملحقات>خلية2 ملحقات>خلية3

ملحقات>titre1 ملحقات>titre2 ملحقات>titre3

النتيجة

قن Wiki

قن HTML

عنوان عمود1	عنوان عمود2
خلية1	خلية2

{| border="1" ! عنوان عمود1 !! عنوان عمود2 |- |خلية1 |خلية2 |}

        عنوان عمود1      عنوان عمود2    
        خلية1      خلية2

في المثال الآتي البرنامج يظهر الخلية على شكل عنوان رغم استعمال || محل !!:

النتيجة

قن Wiki

قن HTML

عنوان عمود1	عمود2

{| border="1" ! عنوان عمود1 || عمود2  |}

        عنوان عمود1      عمود2

لتفادي المشكل, يجب ارجاع العمود الثاني إلى السطر:

النتيجة

قن Wiki

قن HTML

عنوان عمود1	عمود2

{| border="1" ! عنوان عمود1 | عمود2 |}

        عنوان عمود1      عمود2

caption عنوان جدول

العنصر caption يمثل عنوان جدول. لإدراج عنوان جدول:

|+ عنوان

الذي يعطي في HTML:

عنوان

هنا أيضا يمكن استعمال ملحقات

|+ ملحقات|عنوان

الذي يعطي

ملحقات>عنوان

لا يسمح بإضافة أكثر من عنوان جدول

النتيجة

قن Wiki

قن HTML

عنوان
عمود1	عمود2

{| border="1" |+ عنوان | عمود1 | عمود2 |}

   عنوان        عمود1      عمود

مثال عام

الآن بعد أن رأينا مختلف الوسوم التي تأخد بعين الاعتبار من wiki, سنضع هنا جدول يجمع ما سبق ذكره.

النتيجة

قن Wiki

قن HTML

عنوان
	عنوان1	عنوان2
عنوان سطر	خلية1	خلية2

{| border="1" |+ عنوان ! ! عنوان1 !! عنوان2 |- ! عنوان سطر | خلية1 | خلية2 |}

   عنوان             عنوان1      عنوان2    
        عنوان سطر      خلية1      خلية2

جداول متداخلة

عند إنشاء جدول, يمكن ادراج جدول آخر. إذن بدل وضع نص في الخلية, يكفي وضع جدول كما في هذا المثال:

النتيجة

قن Wiki

قن HTML

يمين

جدول متداخل

خلية

يسار

خلية1

خلية2

خلية3

{| border="1" | يمين | {| border="1" |جدول متداخل |خلية |} | يسار |- | خلية1 | خلية2 | خلية3 |}

        يمين                                 جدول متداخل            خلية          
       
          يسار    
        خلية1      خلية2      خلية3

الملحقات

تمكن من إضافة خصائص أخرى إلى الجداول, انظر ما يلي:

border إطار

هنا يمكن أن نضع سمك الإطار الذي يحيط بالخلايا أو الجدول. و إذا أردنا عدم وضع الإطار نعطي ل border القيمة 0.

border="x"

حيث x تمثل السمك.

النتيجة

قن Wiki

قن HTML

دون إطار1

دون إطار2

{| border="0" |دون إطار1 |دون إطار2 |}

        دون إطار1      دون إطار2

إطار1

إطار2

{| border="1" |إطار1 |إطار2 |}

        إطار1      إطار2

إطار كبير1

إطار كبير2

{| border="10" |إطار كبير1 |إطار كبير2 |}

        إطار كبير1      إطار كبير2

يمكن أيضا اختيار نمط للإطار:

style="border:Xpx Y"

x سمك الإطار(ب pixel) و y نمطه (dotted, dashed, double...)

النتيجة

قن Wiki

قن HTML

مثال : dotted

{|style="border:2px dotted;" |مثال : dotted |}

مثال : dashed

{|style="border:2px dashed;" |مثال : dashed |}

مثال : double

{|style="border:5px double;" |مثال : double |}

rowspan و colspan

يمكنان من إدماج عدة خلايا في خلية واحدة. و يستعملان كما يلي:

colspan="x" rowspan="x"

حيث x يمثل عدد الخلايا المدمجة. انظر المثال:

النتيجة

قن Wiki

قن HTML

عادي	مندمج
خلية1	خلية2	خلية3

{| border="1" | عادي | colspan="2" | مندمج |- | خلية1 | خلية2 | خلية3 |}

        عادي      مندمج    
        خلية1      خلية2      خلية3

ادماج السطور:

النتيجة

قن Wiki

قن HTML

أول	ثان
يمين1	يسار1
يمين2
يمين3

{| border="1" | أول | ثان |- | يمين1 | rowspan="3" | يسار |- | يمين2 |- | يمين3 |}

        أول      ثانe    
        يمين1      يسار    
        يمين2    
        يمين3

align و valign

تمكن من وضع الجدول في اليسار في الوسط في اليمين.

للتموضع الأفقي, نستعمل code>align, في حين نستعمل valign للتموضع العمودي (خاص بتموضع النص) :

align="left" align="center" align="right"

valign="top" valign="center" valign="bottom"

مثال:

النتيجة

قن Wiki

قن HTML

إلى اليسار

{| align="left" border="1" |إلى اليسار |}

        إلى اليسار

في الوسط

{| align="center" border="1" |في الوسط |}

        في الوسط

{| align="right" border="1" |إلى اليمين |}

        إلى اليمين

التموضع.

النتيجة

قن Wiki

قن HTML

تموضع

يسار

وسط

يمين

{| border="1" | تموضع |- | align="left" | يسار |- | align="center" | وسط |- | align="right" | يمين |}

        تموضع    
        يسار    
        وسط    
        يمين

التموضع العمودي

النتيجة

قن Wiki

قن HTML

تموضع

أعلى

وسط

أسفل

{| border="1" | height="150" | تموضع | valign="top" | أعلى | valign="center" | وسط | valign="bottom" | أسفل |}

        تموضع      أعلى      وسط      أسفل

cellspacing و cellpadding

من الممكن تغيير الفراغ بين الخلايا بواسطة cellspacing. كما يمكن تحديد الفراغ بين النص و الحواف الداخلية للخلية بواسطة cellpadding .

cellspacing="x"

cellpadding="x"

مثال يستعمل cellspacing :

النتيجة

قن Wiki

قن HTML

خلية1	خلية2
خلية3	خلية4

{| border="1" cellspacing="5" |خلية1 |خلية2 |- |خلية3 |خلية4 |}

        خلية1      خلية2    
        خلية3      خلية4

خلية1	خلية2
خلية3	خلية4

{| border="1" cellspacing="20" |خلية1 |خلية2 |- |خلية3 |خلية4 |}

        خلية1      خلية2    
        خلية3      خلية4

مثال يستعمل cellpadding :

النتيجة

قن Wiki

قن HTML

خلية1	خلية2
خلية3	خلية4

{| border="1" cellpadding="5" |خلية1 |خلية2 |- |خلية3 |خلية4 |}

        خلية1      خلية2    
        خلية3      خلية4

خلية1	خلية2
خلية3	خلية4

{| border="1" cellpadding="20" |خلية1 |خلية2 |- |خلية3 |خلية4 |}

        خلية1      خلية2    
        خلية3      خلية4

width و height

بواسطة width و height ، نستطيع تحديد عرض و علو الجدول و كذلك أبعاد الخلية .

أمثلة:

النتيجة

قن Wiki

قن HTML

خلية

{| border="1" width="10" |خلية |}

        خلية

خلية

{| border="1" width="100" |خلية |}

        خلية

خلية

{| border="1" width="200" |خلية |}

        خلية

النتيجة

قن Wiki

قن HTML

خلية

{| border="1" width="33%" |خلية |}

        خلية

خلية

{| border="1" width="50%" |خلية |}

        خلية

خلية

{| border="1" width="100%" |خلية |}

        خلية

النتيجة

قن Wiki

قن HTML

جدول1
1/3 خلية 1	1/3 خلية 2	1/3 خلية 3

{| border="1" width="100%" | colspan="3" | جدول1 |- | width="33%" | 1/3 خلية 1 | width="33%" | 1/3 خلية 2 | width="33%" | 1/3 خلية 3 |}

        جدول1    
        1/3 خلية 1      1/3 خلية 2      1/3 خلية 3

جدول2
1/2 خلية 1	1/4 خلية 2	1/4 خلية 3

{| border="1" width="100%" | colspan="3" | جدول2 |- | width="50%" | 1/2 خلية 1 | width="25%" | 1/4 خلية 2 | width="25%" | 1/4 خلية 3 |}

        جدول2    
        1/2 خلية 1      1/4 خلية 2      1/4 خلية 3

bgcolor

من الممكن تغيير لون الخلفية الخاصة بالخلية بواسطة bgcolor:

bgcolor="#hex"

لتحديد اللون يجب استعمال الرمز # متبوعا برمز اللون و هو عدد في النظام السدس عشاري. انظر مساعدة:ألوان لمعرفة قيم الألوان.

مثال :

النتيجة

قن Wiki

قن HTML

أحمر

أخضر

أزرق

{| border="1" | bgcolor="#FF0000" | أحمر | bgcolor="#00FF00" | أخضر | bgcolor="#0000FF" | أزرق |}

        أحمر      أخضر      أزرق

style

لتغيير لنمط نستعمل style . و يمكن استعماله في الجدول كما في الخلية.

مثال

النتيجة

قن Wiki

قن HTML

خلية 1

خلية 2

خلية 3

{| border="1" style="background-color:#CCFFCC" | خلية 1 |- | خلية 2 |- | خلية 3 |}

        خلية 1    
        خلية 2    
        خلية 3

جداول يمكن ترتيب محتواها

لعمل جداول يمكن ترتيب محتواها حسب الأرقام يمكن إضافة خاصية الترتيب "wikitable table-responsive sortable" وذلك بالشكل التالي:

النتيجة

قن Wiki

قن HTML

أرقام	أعمار	أوزان
1	22	65
2	33	87
3	15	45
4	70	95
5	65	110

{| class="duhoc-ar wikitable table-responsive  sortable"  |- !أرقام!! أعمار !! أوزان |- |1||22||65 |- |2||33||87 |- |3||15||45 |- |4||70||95 |- |5||65||110 |}

جداول يمكن ترتيب محتواها مع استثناء صف أخير من الترتيب

لعمل جداول يمكن ترتيب محتواها حسب الأرقام يمكن إضافة خاصية الترتيب "wikitable table-responsive sortable"، ولكي نستثني الصف الأخير (أو الصفوف الأخيرة) من الترتيب نضع قبل ذلك الصف (أو الصفوف) جملة class="duhoc-ar sortbottom" وذلك بالشكل التالي:

النتيجة

قن Wiki

قن HTML

الفرقة	إناث	ذكور
1	22	65
2	33	87
3	15	45
4	70	95
5	65	110
إجمالي	205	402

{| class="duhoc-ar wikitable table-responsive  sortable"  |- !الفرقة!! إناث!! ذكور |- |1||22||65 |- |2||33||87 |- |3||15||45 |- |4||70||95 |- |5||65||110 |-class="duhoc-ar sortbottom" |إجمالي||205||402 |}

منع الترتيب بناءً على أحد الأعمدة

يمكن منع الترتيب بناءً على أحد العمدة باستخدام جملة class="duhoc-ar unsortable" وذلك بالشكل التالي:

لاحظ أن العمود الأول أصبح غير ممكن الترتيب بناءً عليه لأننا استخدمنا تلك الجملة في عنوانه

النتيجة

قن Wiki

قن HTML

year	Female	Male
1	22	65
2	33	87
3	15	45
4	70	95
5	65	110
إجمالي	205	402

{| class="duhoc-ar wikitable table-responsive  sortable"  |- !class="duhoc-ar unsortable"|year!! Female!! Male |- |1||22||65 |- |2||33||87 |- |3||15||45 |- |4||70||95 |- |5||65||110 |-class="duhoc-ar sortbottom" |إجمالي||205||402 |}

This article uses material from the Wikipedia العربية article مساعدة:جدول, which is released under the Creative Commons Attribution-ShareAlike 3.0 license ("CC BY-SA 3.0"); additional terms may apply (view authors). المحتوى متاح وفق CC BY-SA 4.0 ما لم يرد خلاف ذلك. Images, videos and audio are available under their respective licenses.
®Wikipedia is a registered trademark of the Wiki Foundation, Inc. Wiki العربية (DUHOCTRUNGQUOC.VN) is an independent company and has no affiliation with Wiki Foundation.

ع ن ت مساعدة تقنية في ويكيبيديا
تستطيع الحصول على مساعدة شخصية في بوابة المشاركة أو ميدان المساعدة أو ميدان التقنية أو صفحات النقاش أو قناة الدردشة.
التقنية	دعم متعدد اللغات ملاحظات المتصفح محو الاختزان تصفح من الجوال اختصارات لوحة المفاتيح تحرير الصفحات تضارب في التحرير إلغاء وتراجع المحرر المرئي تاريخ الصفحة مستويات صلاحيات المستخدم تبصرة تحرير قناة الدردشة
صفحات خاصة متعلقة	بحث دخول استرجاع كلمة المرور إشعارات نقل صفحة نقل إداري مراقبة الصفحات مساهمات المستخدم ماذا يصل هنا أحدث التغييرات تعديلات معلقة استيراد مرشح الإساءة
نص ويكي	نص ويكي أساسيات التحرير استخدام الألوان قوائم كلمات سحرية قسم جدول ترتيب القوائم
رابط تشعبي	وصلة وصلة دائمة الترجمة وصلات إنترويكي وصلات اللغات لون الوصلة فرق أرشفة الويب
الوسائط المتعددة	مساعدة الوسائط رفع الصور ملفات صور ورشة الصور
رسوم أخرى	عرض صيغ رياضية رموز الرياضيات ويكي هييرو
قوالب وصيغ لغة لوا	قوالب قوالب رسائل قوالب صيانة وتحسين وثوقية المقالات قوالب الاستشهاد حدود القوالب ملاعب القوالب ومختبراتها توثيق قالب تحديث لوا
هيكل البيانات	نطاق مقالة استخدام صفحات النقاش أرشفة صفحة نقاش صفحات المستخدمين ملفات صفحة الملف نطاق ميدياويكي بلاغ أخطاء وطلب ميزات قوالب بوابات كتب ويكيبيديا:مدرس المقرر لغة لوا مواضيع ملفات
تخصيص وأدوات	النص الفائق في نص الويكي تفضيلات سكربتات أدوات
تحرير آلي	بوت كيف تصنع بوت لمح البصر المصناف الفوري وب كلينر أوتوويكي براوزر المنبثقات هغل
مشاريع شقيقة	ويكي بيانات وصف عنصر فهرسة كتاب

جدول

tr

th

أمثلة

صيغة الجدول

جدول

td

caption عنوان جدول

مثال عام

جداول متداخلة

الملحقات

border إطار

rowspan و colspan

align و valign

cellspacing و cellpadding

width و height

bgcolor

style

جداول يمكن ترتيب محتواها

جداول يمكن ترتيب محتواها مع استثناء صف أخير من الترتيب

منع الترتيب بناءً على أحد الأعمدة

Tags:

🔥 Trending searches on Wiki العربية: