عرض مشاركة واحدة
  #1  
قديم 03-17-2014, 01:45 PM
الصورة الرمزية JERY7  
رقـم العضويــة: 85674
تاريخ التسجيل: Feb 2011
الجنس:
العـــــــــــمــر: 32
المشـــاركـات: 7,979
نقـــاط الخبـرة: 2166
Twitter : Twitter
icon67 الدرس السادس 6 || دمج الجداول




اللَّهُمَّ انْفَعْنَا بِمَا عَلَّمْتَنَا , وَعَلِّمْنَا مَا يَنْفَعُنَا , وَزِدْنَا عِلْمًا إِلَى عِلْمِنَا

السلام عليكم ورحمة الله وبركاته..

كيفكم جميعاً أن شاء الله تمام !؟

وما تشكون من بأس!

اليوم موضوعنا راح نكتب فيه أكواد مهمة جداً جداُ

وهي تابعة للدرس الماضي وهو الجداول

تعلمنا كيف ننشى جدول حسب الصفوف والأعمدة

لكن هذا الشكل كيف نتمكن من عمله




هذا نحتاج لدمج الصفوف والأعمدة بحيث عندما ندمجها تاتي بأشكال
فريدة ومناسبه للموقع

طيب شوف هذه الصورة شرح لخاصيتين
وهما





طيب هذا هو جدولنا


نريد دمج رقم 13 مــع 00 بجانبها على اليمين

ماهي الخاصية التي سوف نستخدمها
وكيف نستخدمها ؟

نقول لكم عند دمج الصفوف فأننا
نستخدم
COLSPAN
مع أعطائه قيمة وهي عدد الخلاياء التي سوف تدمجها
ويجب أحتساب الخلية الأولى
بحيث يصبح الكود في الصف رقم 13 بهذا الشكل
كود:
CLOSPAN="2"
تنويةّ:-
أذا دمجنا الصف بالذي بجانبه سوف تأتي هكذا





وأقول لكم لأتخفُ فهذا أمر طبيعي
أننا عندما دمجنا لم نحذف الخلية التي نريد الدمج معها
من الملف
فعندما نحذف هذا الخلية
كما الأن



يصبحُ جدولنا هكذا



تم الدمج بنجاح

طيب نريد دمج
13 مع 9 و 00 التي بجانبها

أقول لكم لزم ندمج 9 و 00 من ثم ندمجها مع 13

لايمكن دمج أكثر من عمود مع صف او اكثر والعكس صحيح

نعمل مع 9 كما عملنا مع 13

كود:
CLOSPAN="2"
ونحذف رقم 00 من الملف ويأتي اسفل رقم 9 ""طبيعياَ""

يصبح كهذا




الأن نأتي للجزء ألأخرمن الدرس وهو دمج الأعمدة

وهو نفس دمج الصفوف لكن نغير الأمر أو الخاصيه من
كود:
ROWSPAN="2"
ونحذف التي أسفلها

وذكرنا بالتنوية الأخير

"
COLSPAN = تاتي من اليسار الى اليمين فقط
ROWSPAN = تاتي من أعلى الى أسفل فقط
"

نريد الأن دمج رقم 13 مع 9 وحذف رقم 9 من الملف

نرى الكود الخاص بذلك



صورة أخيرة للجدول بعد الدمج النهائي




الحمدلله على الأنتهاء من الجدول

والمعذرة على التأخير في طرح هذا الاسبوع لمشاغل الدراسة

واجب الدرس

هذا هو الملف حمله وعدل عليه بحيث

تدمج 00 مع 10 = ROWSPAN
&
تدمج 6 مع 5 = COLSPAN

كان هذا الدرس الجميل البسيط أهم الدروس في
HTML
وألأنن نودعكم والى الأسبوع القادم


في أمان الله


سُبْحَانَكَ اللَّهُمَّ وَبِحَمْدِكَ أَشْهَدُ أَنْ لا إِلهَ إِلأَ انْتَ أَسْتَغْفِرُكَ وَأَتْوبُ إِلَيْكَ





التعديل الأخير تم بواسطة JERY7 ; 03-17-2014 الساعة 01:57 PM
رد مع اقتباس