Rounded corner Table
جدول ذو زوايا غير حادة
درس مهم لمصممي المواقع لعمل الحداول بشكل جديد ذو زوايا غير حادة

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

  • اضغط في داخل الجزء العلوي من يسار الجدول كما في الشكل التالي
  • قم بوضع الخيارات التالية:
    Horz > Left
    Vert > Top
  • لاحظ الشكل التالي:

  • قم الآن بوضع الصورة في داخل هذا المربع
  • طبعاً الصورة هذه تم تصميمها مسبقاً بواسطة الفوتوشوب
    بالمجوع صممنا 4 صور، عبارة عن زوايا المربع

  • الآن نضغط في داخل المربع الموجود في الجزء العلوي من يمين الجدول كما في الشكل وقم بإختيار:
    Horz > Right
    Vert > Top

  • طبق الآن نفس الخطوات السابقة للجزء السفل من الجدول، ولكن بدلا من ان نختار
    Vert > Top
    نختار
    Vert > Bottom
    لاحظ الشكلين التاليين:

الجزء الأسفل من يسار الجدول

الجزء الأسفل من يمين الجدول

  • اضغط الآن في المربع الوسط من الجزء العلوي من الجدول كما في الشكل التالي واختر
    100%
  • هذه العملية ستجعل مركز الجدول يمتد على إمتداد الحدول الأفقي

  • سنقوم الآن باختيار لون الزوايا حتى نضيفع للجدول وذلك بواسطة خيار الـ BG لاحظ الشكل التالي:
  • هذه العملية ستغير خلفية الجدول إلى اللون المطلوب

  • نستخدم الآن نفس العملية في تلوين بقية أجزاء الجدول وسنحصل على النتيجة التالية:

اضغط على F12

هذه النتيجة النهائية للجدول .. تستطيع الآن أن تضيف ما تريده من مواد في المربع الوسط من الحدول

درس تصميم موقعك بالفوتوشوب الجزء الثاني
درس فوتوشوب درس عمل شاشة LCD

Leave a Comment