X100
03-08-2010, 13:48
بسم الله الرحمن الرحيم
السلآم عليكم ورحمة الله وبركاته
كيف حالكم جميعاً ؟
ان شاء الله بخير وصحة وعافية
أقدم لكم أخيراً الدرس النهائي والختامي من دورة تصميم ستايلات منتديات الـ vb ::سعادة::
نأسف على التأخير مرة أخرى :ميت: ، انتهى اشتراك النت لدي واضطررت الآن الى التوجه الى أحد المقاهي :D
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
الدرس هذا سنتحدث فيه عن برمجة الـ CSS
يعني أن كل عملنا تقريباً سيكون باعدادات المنتدى الداخلية ، وسيكون الدرس على شكل فقرات :) .
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
الفهرس :
• اصلاح الفراغ
• تلوين الخلفية
• تركيب خلفية ◄ خارجية - داخلية
• مجلدات الصور
• تأطير / تلوين داخلي للقوالب
• تقليص المنتدى
• حفظ الستايل
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
نبدأ الدرس على بركة الله :
{ اصلاح الفراغ }
- بعد فتح المنتدى ستلاحظون وجود فراغ بسيط يظهر على حواف الستايل ، مثل الصورة التالية :
http://www.mexat.com/vb/attachment.php?attachmentid=1297964&stc=1&d=1288868262
* لإصلاحها نتبع الآتي :
- بعد الدخول على لوحة تحكم الإدارة نختار التحكم بالاستايلات
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
- نختار " اذهب " على الستايل الذي نود تعديله
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
- بعد النزول الى أسفل قليلاً .. واذا وجدنا المستطيل المسمى " خلفية المنتدى / Body "
نعدل " خواص CSS الإضافية بحيث نجعل جميع الأرقام الموجودة الى 0 .. ثم ننزل آخر الصفحة ونختار " حفظ "
http://www.mexat.com/vb/attachment.php?attachmentid=1297967&stc=1&d=1288868262
- والنتيجة اختفاء الفراغات ::جيد::
http://www.mexat.com/vb/attachment.php?attachmentid=1297968&stc=1&d=1288868262
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
{ تلوين الخلفية }
الخلفية هي الفراغات البيضاء الظاهرة أمامكم عند فتح الستايل :
http://www.mexat.com/vb/attachment.php?attachmentid=1297986&stc=1&d=1288869478
لهذا أولاً ، نفتح أي جزء من صور الستايل بالمنتدى والذي يحمل لون الخلفية الذي نريده .. ثم نختار هذه الأداة http://www.mexat.com/vb/attachment.php?attachmentid=1297987&stc=1&d=1288869478
سيظهر اللون في المربعين الصغيرين . نضغط عليه http://www.mexat.com/vb/attachment.php?attachmentid=1297988&stc=1&d=1288869478
ننسخ الكود الظاهر امامنا
http://www.mexat.com/vb/attachment.php?attachmentid=1297989&stc=1&d=1288869478
ثم نذهب الى لوحة تحكم الإدارة
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ثم ننزل للأسفل حتى نجد القالب المسمى " خلفية الصفحة / Page Background " ونضع الكود بدون مسح الـ #
http://www.mexat.com/vb/attachment.php?attachmentid=1297990&stc=1&d=1288869478
ثم نذهب الى آخر الصفحة ونختار " حفظ " .. ونذهب الى المنتدى ونرى النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
{ تركيب الخلفية }
[ تركيب خلفية خارجية ]
الخلفية الخارجية هي الخلفية التي تقع على حدود الستايل ، وتقريباً هذه الطريقة لا تفيد الا بالستايل الخالي من مناطق التمدد او الستايلات المقلّصة العرض ..
وهي الموجودة برقم واحد بالصورة التالية :
http://www.mexat.com/vb/attachment.php?attachmentid=1302666&stc=1&d=1289469404
لتركيب صورة للخلفية نتبع الآتي :
ندخل على لوحة تحكم الإدارة ونختار التحكم بالاستايلات :
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
نختار " اذهب " على الستايل الذي نود تركيب الخلفية فيه
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ننزل للأسفل حتى نرى الجدول " خلفية المنتدى / Body "
وتحديداً المحدد باللون البرتقالي ..
http://www.mexat.com/vb/attachment.php?attachmentid=1302706&stc=1&d=1289471091
في الفراغ الموجود ،
#E1E1E2 نضيف بعدها مسافة ثم نلصق هذا الكود بعد تعديل ما يأتي :
url(Folder Name/Background Name.jpg) repeat-y fixed center topالـ Folder Name نغيره ونجعله اسم مجلد الستايل الموجود بداخل ملف الـ vb
اما الـ Background Name فنغيره ونجعله اسم صورة الخلفية الموجودة بداخل ملف الستايل ،
اما الـ jpg فنغيرها الى صيغة صورة الخلفية التي صممناها
وأيضاً اذا كان اسم المجلد او الصورة يحتوي على مسافة فتكتب المسافة على شكل 20%
- واضيف أيضاً انه يفضل ان تكون صورة الخلفية بعرض 1280 بكسل ان أمكن .. او أياً كان عرض شاشة جهازك ..
بعد التعديل :
url(New%20Style/Background.jpg) repeat-y fixed center tophttp://www.mexat.com/vb/attachment.php?attachmentid=1302668&stc=1&d=1289469404
ثم والخطوة الأخيرة نضع صورة الخلفية بداخل ملف الستايل الذي نريده .. وانا وضعته بمجلد الـ New Style
النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302699&stc=1&d=1289470325
وأكرر بأن هذه الخلفية الخارجية لا تفيد الا بالستايلات الخالية من مناطق التمدد و والمنتدى المقلص العرض
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
[ تركيب خلفية داخلية ]
الخلفية الداخلية هي الخلفية البيضاء والمحددة برقم 2 بالصورة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302666&stc=1&d=1289469404
لتعديلها ندخل الى لوحة تحكم الادارة ، ونختار التحكم بالاستايلات
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
ثم نختار الستايل الذي نود التعديل عليه ونضغط " اذهب "
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ننزل الى الأسفل حتى نجد القالب المسمى " خلفية الصفحة / Page Background "
http://www.mexat.com/vb/attachment.php?attachmentid=1302686&stc=1&d=1289469758
وبعد كود اللون
#FFFFFF نضيف مسافة ثم الكود التالي :
url(File Name/Background name.jpg) repeat-y fixed center topالـ Folder Name نغيره ونجعله اسم مجلد الستايل الموجود بداخل ملف الـ vb
اما الـ Background Name فنغيره ونجعله اسم صورة الخلفية الموجودة بداخل ملف الستايل ،
اما الـ jpg فنغيرها الى صيغة صورة الخلفية التي صممناها
وأيضاً اذا كان اسم المجلد او الصورة يحتوي على مسافة فتكتب المسافة على شكل 20%
- واضيف أيضاً انه يفضل ان تكون صورة الخلفية بعرض 1280 بكسل وطول 800 بكسل ان أمكن .. او أياً كان حجم شاشة جهازك ..
بعد التعديل :
url(New%20Style/Background.jpg) repeat-y fixed center tophttp://www.mexat.com/vb/attachment.php?attachmentid=1302677&stc=1&d=1289469507
ثم نختار " حفظ " من آخر الصفحة
ثم والخطوة الأخيرة نضع صورة الخلفية بداخل ملف الستايل الذي نريده .. وانا وضعته بمجلد الـ New Style
النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302685&stc=1&d=1289469758
طبعاً انا استخدمت نفس الصورة في الخلفية الخارجية والداخلية لتظهر وكأنها خلفية واحدة :D
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
يتبع
السلآم عليكم ورحمة الله وبركاته
كيف حالكم جميعاً ؟
ان شاء الله بخير وصحة وعافية
أقدم لكم أخيراً الدرس النهائي والختامي من دورة تصميم ستايلات منتديات الـ vb ::سعادة::
نأسف على التأخير مرة أخرى :ميت: ، انتهى اشتراك النت لدي واضطررت الآن الى التوجه الى أحد المقاهي :D
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
الدرس هذا سنتحدث فيه عن برمجة الـ CSS
يعني أن كل عملنا تقريباً سيكون باعدادات المنتدى الداخلية ، وسيكون الدرس على شكل فقرات :) .
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
الفهرس :
• اصلاح الفراغ
• تلوين الخلفية
• تركيب خلفية ◄ خارجية - داخلية
• مجلدات الصور
• تأطير / تلوين داخلي للقوالب
• تقليص المنتدى
• حفظ الستايل
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
نبدأ الدرس على بركة الله :
{ اصلاح الفراغ }
- بعد فتح المنتدى ستلاحظون وجود فراغ بسيط يظهر على حواف الستايل ، مثل الصورة التالية :
http://www.mexat.com/vb/attachment.php?attachmentid=1297964&stc=1&d=1288868262
* لإصلاحها نتبع الآتي :
- بعد الدخول على لوحة تحكم الإدارة نختار التحكم بالاستايلات
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
- نختار " اذهب " على الستايل الذي نود تعديله
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
- بعد النزول الى أسفل قليلاً .. واذا وجدنا المستطيل المسمى " خلفية المنتدى / Body "
نعدل " خواص CSS الإضافية بحيث نجعل جميع الأرقام الموجودة الى 0 .. ثم ننزل آخر الصفحة ونختار " حفظ "
http://www.mexat.com/vb/attachment.php?attachmentid=1297967&stc=1&d=1288868262
- والنتيجة اختفاء الفراغات ::جيد::
http://www.mexat.com/vb/attachment.php?attachmentid=1297968&stc=1&d=1288868262
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
{ تلوين الخلفية }
الخلفية هي الفراغات البيضاء الظاهرة أمامكم عند فتح الستايل :
http://www.mexat.com/vb/attachment.php?attachmentid=1297986&stc=1&d=1288869478
لهذا أولاً ، نفتح أي جزء من صور الستايل بالمنتدى والذي يحمل لون الخلفية الذي نريده .. ثم نختار هذه الأداة http://www.mexat.com/vb/attachment.php?attachmentid=1297987&stc=1&d=1288869478
سيظهر اللون في المربعين الصغيرين . نضغط عليه http://www.mexat.com/vb/attachment.php?attachmentid=1297988&stc=1&d=1288869478
ننسخ الكود الظاهر امامنا
http://www.mexat.com/vb/attachment.php?attachmentid=1297989&stc=1&d=1288869478
ثم نذهب الى لوحة تحكم الإدارة
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ثم ننزل للأسفل حتى نجد القالب المسمى " خلفية الصفحة / Page Background " ونضع الكود بدون مسح الـ #
http://www.mexat.com/vb/attachment.php?attachmentid=1297990&stc=1&d=1288869478
ثم نذهب الى آخر الصفحة ونختار " حفظ " .. ونذهب الى المنتدى ونرى النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
{ تركيب الخلفية }
[ تركيب خلفية خارجية ]
الخلفية الخارجية هي الخلفية التي تقع على حدود الستايل ، وتقريباً هذه الطريقة لا تفيد الا بالستايل الخالي من مناطق التمدد او الستايلات المقلّصة العرض ..
وهي الموجودة برقم واحد بالصورة التالية :
http://www.mexat.com/vb/attachment.php?attachmentid=1302666&stc=1&d=1289469404
لتركيب صورة للخلفية نتبع الآتي :
ندخل على لوحة تحكم الإدارة ونختار التحكم بالاستايلات :
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
نختار " اذهب " على الستايل الذي نود تركيب الخلفية فيه
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ننزل للأسفل حتى نرى الجدول " خلفية المنتدى / Body "
وتحديداً المحدد باللون البرتقالي ..
http://www.mexat.com/vb/attachment.php?attachmentid=1302706&stc=1&d=1289471091
في الفراغ الموجود ،
#E1E1E2 نضيف بعدها مسافة ثم نلصق هذا الكود بعد تعديل ما يأتي :
url(Folder Name/Background Name.jpg) repeat-y fixed center topالـ Folder Name نغيره ونجعله اسم مجلد الستايل الموجود بداخل ملف الـ vb
اما الـ Background Name فنغيره ونجعله اسم صورة الخلفية الموجودة بداخل ملف الستايل ،
اما الـ jpg فنغيرها الى صيغة صورة الخلفية التي صممناها
وأيضاً اذا كان اسم المجلد او الصورة يحتوي على مسافة فتكتب المسافة على شكل 20%
- واضيف أيضاً انه يفضل ان تكون صورة الخلفية بعرض 1280 بكسل ان أمكن .. او أياً كان عرض شاشة جهازك ..
بعد التعديل :
url(New%20Style/Background.jpg) repeat-y fixed center tophttp://www.mexat.com/vb/attachment.php?attachmentid=1302668&stc=1&d=1289469404
ثم والخطوة الأخيرة نضع صورة الخلفية بداخل ملف الستايل الذي نريده .. وانا وضعته بمجلد الـ New Style
النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302699&stc=1&d=1289470325
وأكرر بأن هذه الخلفية الخارجية لا تفيد الا بالستايلات الخالية من مناطق التمدد و والمنتدى المقلص العرض
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
[ تركيب خلفية داخلية ]
الخلفية الداخلية هي الخلفية البيضاء والمحددة برقم 2 بالصورة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302666&stc=1&d=1289469404
لتعديلها ندخل الى لوحة تحكم الادارة ، ونختار التحكم بالاستايلات
http://www.mexat.com/vb/attachment.php?attachmentid=1297965&stc=1&d=1288868262
ثم نختار الستايل الذي نود التعديل عليه ونضغط " اذهب "
http://www.mexat.com/vb/attachment.php?attachmentid=1297966&stc=1&d=1288868262
ننزل الى الأسفل حتى نجد القالب المسمى " خلفية الصفحة / Page Background "
http://www.mexat.com/vb/attachment.php?attachmentid=1302686&stc=1&d=1289469758
وبعد كود اللون
#FFFFFF نضيف مسافة ثم الكود التالي :
url(File Name/Background name.jpg) repeat-y fixed center topالـ Folder Name نغيره ونجعله اسم مجلد الستايل الموجود بداخل ملف الـ vb
اما الـ Background Name فنغيره ونجعله اسم صورة الخلفية الموجودة بداخل ملف الستايل ،
اما الـ jpg فنغيرها الى صيغة صورة الخلفية التي صممناها
وأيضاً اذا كان اسم المجلد او الصورة يحتوي على مسافة فتكتب المسافة على شكل 20%
- واضيف أيضاً انه يفضل ان تكون صورة الخلفية بعرض 1280 بكسل وطول 800 بكسل ان أمكن .. او أياً كان حجم شاشة جهازك ..
بعد التعديل :
url(New%20Style/Background.jpg) repeat-y fixed center tophttp://www.mexat.com/vb/attachment.php?attachmentid=1302677&stc=1&d=1289469507
ثم نختار " حفظ " من آخر الصفحة
ثم والخطوة الأخيرة نضع صورة الخلفية بداخل ملف الستايل الذي نريده .. وانا وضعته بمجلد الـ New Style
النتيجة :
http://www.mexat.com/vb/attachment.php?attachmentid=1302685&stc=1&d=1289469758
طبعاً انا استخدمت نفس الصورة في الخلفية الخارجية والداخلية لتظهر وكأنها خلفية واحدة :D
http://www.mexat.com/vb/attachment.php?attachmentid=1304682&stc=1&d=1289690427
يتبع