[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات

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

زوار بحرين في بي
نواصل معكم دورة تصميم الاستايلات
و اليوم نبدأ درسنا الثاني وسوف اشرح لكم طريقة تقطيع الاستايل
مع طريقة تركيبه على برنامج الفرونت بيج وان شاء الله يكون الشرح واضح
ومفهوم لجميع
نبدأ بسم الله

اولا افتح العمل الى انتهينا عنده في الدرس الاول
ثم أختر الاداه الموضحه في الصوره التاليه

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 1

طبعا الكل يعرف وضيفة الاداه لتقطيع
الان قم بتقطيع الاستايل على الشكل التالي

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 2

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

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 3

الان توجه الى برنامج الفرونت بيج
بعد فتح البرنامج سوف يظهر لك الكود المحدد في الصوره

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 4

احدف الكود فقط اجعل الكود الموجود في السطر الاول كما في الصوره السابقه

الان توجه الى ديزاين .. تصميم كما في الصوره

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 5

الا نقوم بعمل الجدوال كما في الصور 3 جداول

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 6

الان نقوم بعديل على الجداول
كلك يمن على الجداول و اختر الموضح في الصوره التاليه

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 7

الان قم بعمل كما في الصوره التاليه

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 8

الان كلك يمن على الجدول العلوي فقط واختر كما في
الصوره
هذا الخيار لأضافة خلفية الهيدر مع الفوتر

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 9

الان بعد اختيار اضافة خلفيه نختار منطقة التمدد
كما في الصوره التاليه

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 10

الان نقوم ب
أختيار منطقة تمدد الهيدر لجدول العلوي و منطقة تمدد الفوتر لجدول السفلي و
الدجول الى في الوسط اتركه فاضي

الان نقوم بعمل تقسم الى الجدول العلوي و السفلي
كلك يمين على العلوي واختر كما في الصوره

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 11

تابع

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 12

قم بتحديد التقسيم الى 3 جداول كما في الصوره

بعد العمل يصبح الشكل كتالي

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 13

شاهد الجدول الى في الوسط ما عملنه فيه اي شي
الان نقوم بأضافة الصور الى الاستايل بواسطة الاده الموضوحه في الصوره

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 14

ليصبح الشكل كتالي

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 15

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

نقوم بتغير مسار الصور الى الشكل التالي

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 16

شاهد ضع فقط أسم مجلد الاستايل و اسم الصور

الان الشكل النهائي

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 17

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

الان نقوم بتركيب الاستايل على المنتدى توجه الى لوحة التحكم ثم التحكم
بالاستايلات

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 18

ثم من خيارات الاستايل اختر القوالب الشائعه
كما في الصوره

[الدرس الثاني] دورة بحرين في بي لتصميم الاستايلات 19

في قالب الهيدر اذف القالب فقط الكود التالي لاتحذفه

كود PHP:

$spacer_open
$_phpinclude_output
$ad_location[ad_header_end]

ضع كود الهيدر اعلى الكود السابق

في الهيدر توجه الى اسفل القالب ضيف كود الهيدر
ثم ارفع الصور الى مجلد المنتدى

يعطيك العافيه

» الدرس الاول والثانى من دوره تصميم الاستايل بتقنيه (css)
» دورة تصميم ستايل vb ( الستايلات الاحترافيه )
» الدرس الثامن نصائح لجعل موقعك متوافق مع المعاير القياسية
» الدرس الخامس من دوره تصميم الاستايل بتقنيه (css)..
» الدرس السادس (ملحق) تركيب الفلاش بتقنيه ال css