بيانات كاتب الموضوع | الدرس الحادي عشر: المزيد حول الجداول HTML |
| كاتب الموضوع | رسالة |
|---|
| المعلومات | الكاتب: | | اللقب: | | الرتبه: | | | الصورة الرمزية | | | البيانات | | عدد المشاركات : | 200 |
| الإتصالات | | الحالة: | | | وسائل الإتصال: | |
| موضوع: الدرس الحادي عشر: المزيد حول الجداول HTML  16/11/2014, 17:25 |
| اذا احتوت المشاركة صورا - قم بالضغط عليها لعرضها بحجمها الطبيعي 
الدرس الحادي عشر: المزيد حول الجداول
عنوان الدرس "المزيد حول الجداول" يبدو مملاً بعض الشيء، لكن أنظر للجانب الإيجابي، إذا تمكنت من إتقان إنشاء الجداول فلن يكون هناك أي شيء في HTML لن تستطيع معرفته واستخدامه.
ماذا بقي إذاً؟خاصيتان هما
- الكود:
-
colspan و
- الكود:
-
rowspan تستخدمان لإنشاء جداول رائعة ومتقنة.
- الكود:
-
Colspan هي اختصار "column span"،
- الكود:
-
Colspan تستخدم في الوسم
- الكود:
-
<td> لتحدد عدد الأعمدة التي ستتمدد لها الخلية:
مثال 1:
- الكود:
-
<table border="1"> <tr> <td colspan="3">Cell 1</td> </tr> <tr> <td>خلية 2</td> <td>خلية 3</td> <td>خلية 4</td> </tr> </table>
سيظهر بهذا الشكل في متصفحك
بتحديد
- الكود:
-
colspan بالقيمة "3" قامت الخلية في الصف الأول بالتمدد لثلاثة أعمدة، ولو قمنا بوضع "2" لقيمة
- الكود:
-
colspan ستتمدد لعمودين اثنين، وسيتعين علينا إضافة خلية أخرى للصف الأول حتى تصبح الأعمدة متساوية
مثال 2:
- الكود:
-
<table border="1"> <tr> <td colspan="2">خلية 1</td> <td>خلية 2</td> </tr> <tr> <td>خلية 3</td> <td>خلية 4</td> <td>خلية 5</td> </tr> </table>
سيظهر بهذا الشكل في متصفحك
| خلية 1 | خلية 2 | | خلية 3 | خلية 4 | خلية 5 |
ما هي خاصية rowspan؟كما ربما خمنت،
- الكود:
-
rowspan تحدد عدد الصفوف التي ستقوم الخلية بالتمدد فوقها:
مثال 3:
- الكود:
-
<table border="1"> <tr> <td rowspan="3">خلية 1</td> <td>خلية 2</td> </tr> <tr> <td>خلية 3</td> </tr> <tr> <td>خلية 4</td> </tr> </table>
سيظهر بهذا الشكل في متصفحك
في المثال أعلاه أعطينا الخاصية
- الكود:
-
rowspan القيمة "3" للخلية 1، هذا يعني أن الخلية يجب أن تتمدد فوق ثلاث صفوف، الصف الذي تقع فيه الخلية مع صفين آخرين أسفلها، الخلية 1 والخلية2 التان تقعان في نفس الصف، بينما الخلية 3 والخلية أربع تشكلان صفين منفصلين.
هل تشعر بالحيرة؟ حسناً، الأمر ليس معقداً لكن من السهل أن تضيع في التفاصيل في بعض الأحيان، لذلك من الأفضل أن ترسم الجدول أولاً على الورق قبل أن تطبقه على HTML.
ربما لا تشعر بالحيرة، إذا قم بإنشاء جدولين واستخدام كل من
- الكود:
-
colspan و
- الكود:
-
rowspan بنفسك.
![]() الموضوع الأصلي : الدرس الحادي عشر: المزيد حول الجداول HTML // المصدر : منتديات إجلجلي Agelgele // الكاتب:énergie
|
|
| | |
| المعلومات | الكاتب: | | اللقب: | مؤسس الموقع | الرتبه: | | | الصورة الرمزية | | | البيانات | | رسالة SMS : | الحمد لله علي كل حال | |  | |  | | العمر : | 32 | | عدد المشاركات : | 1609 |
| الإتصالات | | الحالة: | | | وسائل الإتصال: | |
| موضوع: رد: الدرس الحادي عشر: المزيد حول الجداول HTML 28/11/2014, 16:14 |
| اذا احتوت المشاركة صورا - قم بالضغط عليها لعرضها بحجمها الطبيعي
جزاك الله كل خيرا علي الموضوع
![]() الموضوع الأصلي : الدرس الحادي عشر: المزيد حول الجداول HTML // المصدر : منتديات إجلجلي Agelgele // الكاتب:Ǥlamorous
|
|
| | |
| | الدرس الحادي عشر: المزيد حول الجداول HTML | |
|
23/8/2017, 21:53
هام جداً: قوانين المساهمة في المواضيع. انقر هنا للمعاينة 
