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

الدرس مفصل الثالث طريقة تصميم ستايل style IP.Borad 3

نبدأ بأذن الله سلسلة دروس تصميم الاستايل style

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

الدرس مفصل الثامن :-


هو كيفية تغير خلفية عناوين بينات العضو الموجودة فى الموضوع ( post_block h3 )

الموجود بها اسم العضو ورقم المشاركة # والاى بى الذى يظهر للادارة العامة

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

رمز Code:
} .post_block h3 { background: #d5dee5; }
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل



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

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

رمز Code:
} .post_block h3 { background: #C76114; }
بعد التعديل



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

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

رمز Code:
background: #درجة اللون;
بالكود code التالى :-

رمز Code:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

حيث ipbcity = اسم الصورة المختارة

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

ثم اضغط على Save

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

الدرس مفصل التاسع :-

هو كيفية تغير خلفية المواضيع التى تمت كتابتها وتسمى ( Post background )


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

رمز Code:
/* Post background */ .post_block { background: #fafbfc;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:




قبل التعديل



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

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

رمز Code:
/* Post background */ .post_block { background: #CDB79E;
بعد التعديل



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

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

رمز Code:
background: #درجة اللون;
بالكود code التالى :-

رمز Code:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

حيث ipbcity = اسم الصورة المختارة

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

ثم اضغط على Save

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


الدرس مفصل العاشر :-

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

وتسمى ( ul.post_controls )


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

رمز Code:
ul.post_controls { background-color: #e4ebf3;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل



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

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


رمز Code:
ul.post_controls { background-color: #CDAF95;
بعد التعديل



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

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

رمز Code:
background: #درجة اللون;
بالكود code التالى :-

رمز Code:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

حيث ipbcity = اسم الصورة المختارة

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

ثم اضغط على Save

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

الدرس مفصل الحادى عشر :-

هو كيفية تغير خلفية صندوق ادوات الرد السريع وتسمى ( Fast reply )

رمز Code:
سنقوم بالعمل على ملف ipb_editor.css
نقوم بالبحث عن :-

#ipboard_body .ips_editor .toolbar {
height: 30px;
background: #e4ebf2 url({style_images_url}/gradient_bg.png)


حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل



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

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

رمز Code:
#ipboard_body .ips_editor .toolbar { height: 30px; background: #C76114 url({style_images_url}/gradient_bg.png)
بعد التعديل



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

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

رمز Code:
background: #درجة اللون;
بالكود code التالى :-

رمز Code:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

حيث ipbcity = اسم الصورة المختارة

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

ثم اضغط على Save

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

الدرس مفصل الآثنى عشر :-

هو كيفية تغير خلفية صندوق ادوات الرد السريع وتسمى ( Fast reply )

الموجود بها مشاركة والمحرر الكامل

رمز Code:
هنرجع تانى لـــ ipb_styles.css

نقوم بالبحث عن :-
رمز Code:
body#ipboard_body fieldset.submit, body#ipboard_body p.submit { background-color: #d5dde5;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

قبل التعديل



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

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

رمز Code:
body#ipboard_body fieldset.submit, body#ipboard_body p.submit { background-color: #C76114;
بعد التعديل



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

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

رمز Code:
background: #درجة اللون;
بالكود code التالى :-

رمز Code:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

حيث ipbcity = اسم الصورة المختارة

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

ثم اضغط على Save

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

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

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

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





©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©