بحث متقدم | التسجيل
الويب العربي
  تسجيل دخول
 
   
   

  ملاحظة
الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.




الموقع متاح للإطلاع والقراءة فقط، المشاركة والمواضيع الجديدة غير متاحة حالياً لحين تطوير الموقع.

عـودة للخلف   الويب العربي المركز التعليمي المجاني دعم وتطوير الـ IPB

دعم وتطوير الـ IPB مخصص لكل ما يتعلق بهذا النوع من المنتديات

موضوع مغلق اضف موضوع جديد
 
خيارات الموضوع طريقة العرض
  #1  
قديم 02-05-2011, 09:25 PM
Mr_Design Mr_Design غير متصل
عضو
 
تاريخ التسجيل: Oct 2008
مشاركة: 62
مستوى تقييم العضوية: 11
Mr_Design is on a distinguished road
الافتراضي الدرس الآول طريقة تصميم ستايل IP.Borad 3

بسم الله الرحمن الرحيم

طبعا مدينة الآى بى معودانا دائما على المفاجات

النهاردة يا جماعة انا قررت انى اشرح لكم CCS الخاص بنسخة الجيل الثالث

لكى يتمكن المستخدم العربى من تصميم ستايل منتداة الشخصى بنفسة

انا معتمد يا جماعة فى الدورة دى على بعض الإجتهادات الشخصية بنسبة 50%

وبعض الدروس الأجنبية بنسبة 50% وبكدة نكون وضعنا اللبنة الأولى فى تصميم

ستايل منتديات IP.Board ندخل على الدورة انا مقسم الدورة لمجموعات يعنى كل يوم

إن شاء الله هشرح لكم 3 مناطق من الاستايل مع كيفية تغيرة اللون والارتفاع والخط والحجم

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


-----------------------------------------------------------

الدرس الآول :-

هو كيفية تغير خلفية المنتدى وتسمى ( Board background )

نتبع المسار الاتى لبدأالعمل فى ملف ipb_styles.css


Administration Control Panel

Look & Feel

اختيار الاستايل الذى سنعمل علية وغالبا ما يكون الإفتراضى

CSS

ipb_styles.css

-----------------------------------------------------------

نقوم بالبحث عن :-

كود:
/* ELEMENT STYLES */

body {
 background: #fff;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل




نقوم بتغير fff الى اللون الذى نريدة مثلا C0C0C0

ليتعدل شكل الكود السابق الى شكل الكود التالى

كود:
/* ELEMENT STYLES */

body {
 background: #C0C0C0;
بعد التعديل



ثم اضغط على Save

وبهذا أعزائى الآعضاء نكون انتهينا من تعديل خلفية المنتدى

-----------------------------------------------------------

الدرس الثانى :-

هو كيفية تغير عناوين الآقسام وتسمى ( maintitle )

نقوم بالبحث عن :-

كود:
body .maintitle {
background: #1D3652 url(http://www.ipbcity.net/public/style_images/gradient_bg.png) repeat-x left 50%;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل



نقوم بتغير 1D3652 الى اللون الذى نريدة مثلا C73F17

ليصبح الكود السابق بهذا الشكل


كود:
body .maintitle {
background: #C73F17 url(http://www.ipbcity.net/public/style_images/gradient_bg.png) repeat-x left 50%;]
بعد التعديل



اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

فعليك إستبدال :-

كود:
background: #C73F17 url(http://www.ipbcity.net/public/style_images/gradient_bg.png) repeat-x left 50%;
بالكود التالى :-

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة

حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg

ثم اضغط على Save

وبهذا أعزائى الآعضاء نكون انتهينا من تعديل عناوين الآقسام

-----------------------------------------------------------

الدرس الثالث :-

هو كيفية تغير خلفية عناوين الاقسام الصغرى وتسمى ( Table column headers )


نقوم بالبحث عن :-

كود:
/* Table column headers */
.header {
 background: #b6c7db;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل




نقوم بتغير b6c7db الى اللون الذى نريدة مثلا C76114

ليتعدل شكل الكود السابق الى شكل الكود التالى


كود:
/* Table column headers */
.header {
 background: #C76114;
بعد التعديل





اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

فعليك إستبدال :-

كود:
 background: #C76114;
بالكود التالى :-

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة

حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg

ثم اضغط على Save

وبهذا أعزائى الآعضاء نكون انتهينا من تعديل عناوين الآقسام الصغرى

-----------------------------------------------------------

وبكدة يكون انتهى درسنا اليوم بخصوص ال3 اقسام الللى تم شرحهم

الى لقاء أخر باذن الله فى تكملة الدروس والكمال لله عز وجل






التوقيع
شركة مدينة الآى بى

WwW.ipbcity.net

استلم بروفة لتصميمك فى خلال ساعة واحدة فقط
  #2  
قديم 03-05-2011, 03:22 AM
Maxmiz Maxmiz غير متصل
عضو
 
تاريخ التسجيل: Mar 2011
مشاركة: 53
مستوى تقييم العضوية: 8
Maxmiz is on a distinguished road
الافتراضي

مشكووووور شرح ممتاز






التوقيع
إسم الشركة : ماكسميز لخدمات الويب وتكنولوجيا المعلومات
صاحب الشركة : محمد زكريا متولى
خدمات الشركة : استضافة وتصميم وبرمجة ودعم فنى
مقر الشركة : مصر - محافظة الشرقية
هاتف الشركة : 20194666667+
بريد الشركة : sales(at)maxmiz.com
الدعم الفنى : www.maxmiz.com/support
روابط الشركة : www.maxmiz.com
موضوع مغلق



خيارات الموضوع
طريقة العرض

قوانين المشاركة
لا يمكنك إضافة موضوع جديد
لا يمكنك الرد على المواضيع
لا يمكنك إضافة مرفقات
لا يمكنك تعديل مشاركاتك

كود vB متاح
كود [IMG] متاح
كود HTML مغلق
إنتقل إلى

مواضيع مشابهة
الموضوع الكاتب القسم مشاركة آخر مشاركة
شودي ستايل .. معنا للآبداع حكاية .. [ الستآيل المجآني الآول ] شودي ستايل قسم المنتديات 3 12-03-2009 12:39 PM
دورة احتراف تصميم المواقع - الدرس الرابع - تصميم واجهه بالفوتوشوب - ALI-X تبادل خبرات التصميم 4 01-03-2009 05:33 PM
الدرس الاول من دورة تصميم المواقع (تصميم موقع استضافه) MaX7 تطويرالمواقع 13 08-12-2007 04:39 PM
الدرس الأول : تصميم شعار موقع ستون كولد تبادل خبرات التصميم 1 11-11-2007 04:41 PM
الدرس الثاني : تصميم استايل احترافي alialsahher تبادل خبرات التصميم 6 02-04-2007 03:02 PM


جميع الأوقات بتوقيت مكة المكرمة. الساعة الآن » 06:49 AM.

Powered by vBulletin
Copyright ©2000 - 2018, Jelsoft Enterprises Ltd.


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

صحيفة متخصصة في متابعة أخبار وجديد الإنترنت العربي
والحوارات الصحفية ومعلومات تقنية متنوعة .

   
 
 

للتواصل مع فريق عمل الويب العربي
يمكنك ذالك من خلال مركز الدعم والمساندة.

 الدعم الفني |  اعتماد العضويات |  قوانين الإنتساب |  إتفاقية الإستخدام |  أهداف الويب العربي |  دليل الشركات |  مكتبة الويب |  صحيفة الويب العربي |  الرئيسية