تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث-

نستكمل ما تعلمناه في الدرسان السابقان:

==الصف الأول==
نبدأ العمل على الصف الأول ووضع شعار الموقع ولنفرض أن الشعار هو عالم الرومانسيه:

هذا الـشعار حجمه 272X98 Pix ونريد إدراجه مع المحافظة على المساحة المتبقية من الخلية .. الحل هو رسم جدول آخر داخل هذا الصف (الخلية) مكون من خليتين عموديتين كالتالي :

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 773_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 773_gu10

ستشاهد عند استعراضك لخصائص إحدى الخليتين أن النسبة المئوية لعرض الخلية هو 50% والطول غير موجود
تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 774_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 774_gu10

وعند إدراج الشعار سنخسر من مساحة الخليتين الشيء الكثير لذلك ستحدد العرض بوحدة ( البكسل ) ونضع في الخانة العرض 272 كمقاس الشعار الذي لدينا و نحدد الارتفاع بعد تحديد المربع الفارغ بـ 98 بكسل كما هو ارتفاع الشعار :

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 775_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 775_gu10

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

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 776_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 776_gu10

الآن يمكننا أن ندرج الشعار في الخلية اليمنى ذات الحجم المناسب وإدراج الشعار (إدراج > صورة > من ملف > "تحديد الشعار من ملفات الجهاز).

لم يبقى علينا هنا سوى إخفاء حدود هذا الجدول ذو الخليتين والانتقال للعمل على الصف الثاني من جدولنا الرئيسي .

==الصف الثاني==

كما ذكرنا سابقاً فإن هذا الصف سنستخدمه لعمل بنر إعلاني للموقع .. لنفرض أن المساحة التي سنستخدمها للبنر هي 500X70 ويجب أن تكون في منتصف المساحة للجدول ..
طبعاً من الضروري أن لا يكون هناك تلاصق بين البنر والشعار في الصف الأول وشريط التصفح الذي سنعمله في الصف الثالث وذلك للحفاظ على شكل الموقع والمظهر ..

سنقوم بالدخول لخصائص هذا الصف (الخلية) وتغير حجم الارتفاع لـ 80 بكسل وضبط المحاذاة العمودية لهذه الخلية للوسط وترك بقية العدادات كما هي:
تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 777_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 777_gu10

نجد أن ارتفاع الخلية قد زاد حسب الحجم الذي وضعناه ..

الآن نريد تحديد مكان البنر الإعلاني في هذه الخلية حسب الحجم الذي حددناه مسبقاً بشرط أن يتوسط خليتنا ..كيف؟

الطريقة سهلة جداً وهو بوضع جدول جديد داخل هذه الخلية ويكون الجدول بمقاس 1x1 أي صف واحد وعامود واحد كما هو موضح:
تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 778_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 778_gu10

أي جدول جديد يأخذ المقاس الافتراضي للعرض وهو 100% من حجم المتصفح ولتحجيم هذا الجدول ليناسب مقاسات البنر ندخل على خصائص الجدول ونعطي الأحجام المطلوبة من ارتفاع وطول كما نريد ولا ننسى وضع المحاذاة على توسيط ليظهر في منتصف الخلية:

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 779_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 779_gu10

سيكون ناتج عملنا كما يلي
تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 780_gu10

يمكن أن نعطي البنر لون محدد بحيث يتناسب مع موقعنا والألوان التي نختارها .. سأختار اللون الموجود في شعار الموقع وهو اللون الأزرق المائل للبنفسجي بالطريقة التالية
خصائص الجدول(جدول البنر أقصد) ==> الخلفية:
تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 781_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 781_gu10

سنختار ألوان إضافية وسيظهر لنا لوحة ألوان أخرى نختار تحديد .. سيتبدل شكل الماوس كما هو على الزر لنتمكن من تحديد اللون وذالك بالذهاب على النقطة الموجودة بالشعار .. كما ترى اللون رقمه الست عشري في FrontPage هو (90,94,B0) انتهت العملية .. موافق وسنجد اللون قد ملأ المساحة المخصصة للبنر:

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 783_gu10

تعلم طريقة تصميم الجداول مع FrontPage -الدرس الثالث- 783_gu10

الحدود لهذا الجدول لا يهم إخفاءها أو إظهارها فهي لن تؤثر على الشكل العام ..

الف شكــر ليكى اوى