[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •||

4923 21/03/2011

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 65925999

بسـم الله الرحمـان الرحيـم .. و الصلاة و السلام على أشــرف المــرسليـن ..
السـلام علــيـكـم و رحمـة الله تعـالى و بــركـاتـه ..
تمضي الأيـام .. لكن الذكرى تبقــى الماضــي مضـى .. و المضارع يمضي
لذلك فلنطـوي صفحـة الماضـي و لنبــدأ بصفحات بيضــاء جديــدة
و لنــجعل من من الذكريات الــوانا في كتابنا و لنــملئ صــفاحتنا البيــضاء بســطور ذهبية
تعــكس جمالها على منتــدانا هذا .. الحمـد لله وحده نحمده و نشكره و نستعـينه و نستـغفره و نعـود بالله
مـن شـرور أنـفسنا و من سيـئات أعمالنا .. من يـهده الله فلا مظل لـه و مـن يظـلل فلن تـجد له ولياً
مرشدا ..و أشـهد ألا إلاه إلا الله وحده لا شريك له و أن محــمداً عبده و رسـوله صــلى الله عليه و
سلم و على آله و صحبه أجمعين و من تبعهم بإحسـان إلى يوم الدين ..ربنا لا علم لنا إلا ما علمتنا إنك أنت العليم
الـخـبــيـر .. ربـنـا لا فــهم لـنا إلا ما فهــمتنا إنــك أنـت الجــواد الـكـريـم .
ربـي اشرح لي صــدري و يســر لي أمــري و احــلل عقــدة من لســاني يفقــهوا قــولي ..
... أما بعد ...
فإن أصــدق الحــديث كــتاب الله تعــالى و خير الــهدي هــديُ سيـدنا محمد صلى الله عليه و سلم ..
و شــر الأمــور مــحدثــاتها و كــل محــدثة بدعة و كل بدعـة ظـلالة و كل ظـلالة فــي النار ..
فاللــهم أجــرنا و قــنا عذابــها برحمتــك يا أرحــم الراحميــن ..
[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 65925999

وبرعاية ;

والآن بعد معرفة طريقة كتابة الأكواد
سنتطرق إلي طريقة تغيير الوان وخلفيات الموقع واضافة صور والتحكم بموقعها
تابعوا معي ..

- خاصية تلوين النص

لتلوين نص داخل صفحة HTML بإستخدام CSS
نضع الكود التالي داخل ملف الـCSS

.F1 {
color: #0903fa;
}
[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 85368652

ثم نفتح ملف الـHTML
ونضع الكود الآتي

BaRcElOnY FaN

النص الأول

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 27063113

نحرص علي ان يتشابه نفس اسم الـClass في الـHTML مع الذي في ملف الـCss
حتي يظهر النص كما نريد

والآن نفتح ملف الـHTML بواسطة الـInternet Explorer

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 82853443

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 82853443

النتيجة

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 52116182

[size=16]- خاصية تلوين الخلفية

لتلوين الخلفية الرئيسية للموقع علينا إستخدام وسم الـbody
فتح ملف الـcss
ونضع الكود التالي ببداية الملف

body {
background-color: #b5e3f9;
}
[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 63893354

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 63893354

ويمكننا إستخدام الخاصية ليس لتلوين الصفحة فقط , بل يمكن إستخدامها لتلوين خلفية نص
وتظهر علي شكل جميل كأنها فقرة

في ملف الـcss في class الـF1 نضع خلفية للنص بالكود التالي

background-color: #69cbfa;

ليكون الكود النهائي بالشكل

body {
background-color: #b5e3f9;
}

.F1 {
color: #0903fa;
background-color: #69cbfa;
}

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 78780731

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 78780731

النتيجة

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 59920015

- خاصية صورة الخلفية

الخاصية تستخدم لوضع صورة كخلفية للموقع او النص
مثلاً نستخدم شعار حصريات المنتدي

نضعها بجانب ملفات css و HTML

لوضع الصورة كخلفية الموقع
نضع الكود التالي في وسم الـbody

background-image: url("startimes2logodeveloper.png");
[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 69255391

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 69255391

[/size]

bckground-repeat: repeat-x	الصورة ستتكرر أفقياً
background-repeat: repeat-y	الصورة ستتكرر رأسياً
background-repeat: repeat	الصورة ستتكرر راسي وافقي
background-repeat: no-repeat	لن تكرر الصورة

لمنع تكرار شعار الحصريات في رئسية الموقع نضيف الخاصية

background-repeat: no-repeat
ليكون الكود بالشكل النهائي

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 94556164

[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 94556164

النتيجة

إلي اللقاء في درس قادم ,,
[ الألــوان والـخلــفيـــات ]ــ•|| دورة تعلم CSS •|| 65925999

» حصريا دورة تعلم أساسيات لغة "HTML"
» دورة لصيانة الموبايل
» دورة في صيانة الستالايت
» تسونغا إلى ربع نهائي دورة فيينا
» Ξ|| دورة تـعــ‘ـلـ’ـم JS ـ ||Ξ خطوتك الأولى تبدأ من هنـآ