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

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

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

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

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

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


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

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

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

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

قبل التعديل



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

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

كود:
}
 
 .post_block h3 {
 background: #C76114;
 }
بعد التعديل



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

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

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

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

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

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

ثم اضغط على Save

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

الدرس التاسع :-

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


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

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

قبل التعديل



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

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

كود:
/* Post background */
 .post_block {
 background: #CDB79E;
بعد التعديل



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

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

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

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

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

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

ثم اضغط على Save

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


الدرس العاشر :-

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

وتسمى ( ul.post_controls )


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

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

قبل التعديل



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

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


كود:
ul.post_controls {
 background-color: #CDAF95;
بعد التعديل



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

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

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

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

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

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

ثم اضغط على Save

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

الدرس الحادى عشر :-

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

كود:
سنقوم بالعمل على ملف   ipb_editor.css
نقوم بالبحث عن :-

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


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

قبل التعديل



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

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

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



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

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

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

كود:
background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

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

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

ثم اضغط على Save

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

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

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

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

كود:
هنرجع تانى لـــ    ipb_styles.css

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

قبل التعديل



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

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

كود:
body#ipboard_body fieldset.submit,
 body#ipboard_body p.submit {
 background-color: #C76114;
بعد التعديل



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

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

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

كود:
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

استلم بروفة لتصميمك فى خلال ساعة واحدة فقط