تحديث آخر نسخة 1.8.37

تقييم الموضوع :
  • 1 أصوات - بمعدل 5
  • 1
  • 2
  • 3
  • 4
  • 5
دروس تصميم واجهة بسيطة و تقطيعها
#5
[CENTER]



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

نقوم بفتح واجهتنا بالفرونت بيج وستكون بهدا الشكل
[صورة: 35hpcfm.jpg]

لاحظوا الاطارات الحمراء تدل على التشوه الحاصل بالواجهة في حين ان الاطار الازرق يحدد اخر سطر متقطع
هدا السطر مهم للغاية وهو اول سطر من اقصى اليمين
نقوم بسحبه نحو باتجاه اليسار حتى تجتمع كل الصور لتصبح الواجهة بهدا الشكل
[صورة: e8phsz.jpg]
الان تجاوزنا المشكل الاول. المشكل التاني وهو ان التصميم يوجد بجهة اليسار
الامر سهل للغاية من خلال الفرونت بيج ادخل على html
توجد باسفل البرنامج وهدا المكان معد لتعديل على التصميم باضافة وسم من وسوم لغة ال html
والوسم المهم لدينا هو انجعل التصميم كله بالوسط ودلك بالوسم التالى
<center></center>
لاحضو هده الصور تبين كود صفحتنا قبل اضافة الوسم center
هنا اول الكود
[صورة: 54u37.jpg]

وهنا اخر الكود
[صورة: 200qyco.jpg]

ان لم تكن تعرف اي شئ بلغة ال html فلا تقلق الامر سهل للغاية
اكتب الكود التالى
<center>
بعد كود <head>
باول صفحتنا وباخر صفحتنا نضيف كود </center>اسفل كود </body>
لمعرفة كل كود على حدي ودوره راجع دورة ال html
ابقي في صفحة الكود وانتبه باعلى الصفحة على الكود التالى او الوسم
<title>Untitled-1</title>
هدا الوسم دوره يحدد عنوان صفحتنا وهو الاسم الدى سيظهر باعلى المتصفح لدلك يجب تغييره الى اسم موقعك
ليصبح متلا بهدا الشكل
<title> شبكة منتديات كنان </titel>
ايضا لاحضو بالصورة الاولى الجزء المحدد بالرقم 2 فهدا الجزء هو الخاص او الماتر على لون خلفية التصميم
نحن هنا مخيرين اما نترك اللون الابيض ويصبح تصميمنا الاسود بالوسط او نغير قيمته الى اللون الدي نريد
وان كنت ايضا تريد ان تكون صورة معينة هي خلفية التصميم فالامر ايضا سهل وسنشر الامور كلها
لتغير اللون فما علينا سوي تغير قيمة ال #ffffff الى القيمة #000000
بالتالى تصبح الخلفية سوداء متل تصميمنا
اما ان اردنا تغير الخلفية بصورة معينة فما علينا الرجوع الى قسم // عادي // ببرنامج الفرونت بيج
تم النقر بالزر الايمن على اي مكان فارغ ونختار من النافدة التى ستظهؤر لنا // خصائص الصفحة كما تبين الصورة التالية
[صورة: 303iwc2.jpg]
تم ستفتح امامنا نافدة اخرى كما بالصورة التالية واليكم شرح لها
[صورة: 1zz2rms.jpg]
نحدد زر //خلفية // رقم 1
نأشر على اختيار //صورة خلفية //
تم كليك على زر // استعراض // لتحديد مكان الصورة
تم اخيرا كليك على موافق وستجد ان الخلفية اصبحة تظهر اسفل التصميم
بهدا نكون قد انهينا التعديل على واجهتنا واصبحة قابلة للعرض على الزوار
لكن قبل دلك اريد ان انبه الى انه حتى هدا النوع من التصاميم يمكن وضع الاعلانات به او اي كود ككود رتب متلا
المهم وضعه بالاعلى او الاسفل خارج اطار الصور متلا نضعه بعد <center> بالاعلى وايضا بعد </center > الموجودة اسفل الكود
مبروك عليك تصميمك وواجهتك احفظ التعديل
واليكم نمودج اخر لنتاج تطبيق هده الطريقة واجهة صممتها لاحد الاصداء
http://a-style.ici.st/
الان انهينا هده الخطوة لم يبقي لنا الا رفعها ونشرها فسيكون بادن الله موضوعنا القادم هو
1/ التسجيل بالاستضافة المجانية وايضا رفع التصميم مع استخدام سكربتات كسكربت اتصل بنا وايضا دفتر الزوار
الشئ الدي لم ادكره هنا هو التعديل على الروابط اتركه لتوضيح الاشياء الممكن عملها بخصوص الروابط
اتمنى لكم الافادة
والله الموفق
[/CENTER]
شبكة منتديات كنان التطويرية

تعود من جديــد مرحبا بكم
الرد
شكر من طرف :


الردود في هذا الموضوع
RE: دروس تصميم واجهة بسيطة و تقطيعها - بواسطة awtil.com - 2008-04-05, 12:06 PM

التنقل السريع :


يقوم بقرائة الموضوع: بالاضافة الى ( 1 ) ضيف كريم