وصف الموضوع

أساسيات التعامل مع css و إنشاء أوراق الأنماط ( مرجع لأكثر الخصائص انتشارا و القيم المحتملة لها )

الأوسمة :
101| CSS| html4| xhtml| أساسيات| دورة
في التصنيفات :CSS

إذا أردت أن تضع وصلة للموضوع في موقعك أو في منتدى يمكنك استخدام الوصلة التالية .

الشفرة :
<a href="http://qatardr.net/class/944" rel="bookmark" > دورة أساسيات css</a>

اضغطCtrl-C أو Apple-C  للنسخ

الوصلة ستظهر كالتالي :
دورة أساسيات css

هذا الموضوع مرخص وفق ترخيص Creative Commons.[ معلومات إضافية حول الترخيص بالعربية]

الخواص المتوافر هي خواص الخلفيات و التي تمكنك من التحكم في شكل الخلفية للعنصر

1-Background Color

حدد لون الخلفية للعنصر ..

background-color: القيمة ;

القيم المتاحة:

• color name :اسم اللون مثلا red , green …الخ
• hexadecimal number : مثلا #fffffff , #000000
• transparent : شفاف

2-Background Image

اختر وضع صورة للخلفية ..

background-image: url(path_to_image);

path_to_image = مسار و اسم الصورة

القيمة المتاحة :

• اسم الصورة
• none : بدون صورة

3-Background Position

تحديد مكان الخلفية للعنصر

background-position: القيمة ;

القيم المتاحة :

• top = أعلى left =يسار
• center= وسط right = يمين
• bottom=أسفل

• top left
• top center
• top right
• center left
• center center
• center right
• bottom left
• bottom center
• bottom right
• x-% y-% نسبة المئوية بالنسبة للمحور السيني و الصادي
• x-pos y-pos الإحداثي السيني و الصادي ..

كما يمكن دمج أي من القيمة مثلا اختيار top 50%

4-Background Repeat

background-repeat: القيمة;

هل يتم تكرار الخلفية أم لا و إذا أردت تكرارها هل تريد تكرارها في كل اتجاه أم في اتجاه واحد فقط

القيم المتاحة :

• no-repeat : بدون تكرار
• repeat : تكرار
• repeat-x : تكرار على المستوى السيني فقط ( أفقيا )
• repeat-y تكرار على المستوى الصادي ( عموديا )

5-Background Attachment

تحرك الخلفية مع الصفحة أم بقائها ثابتة حتى لو حركنا الصفحة بواسطة شريط المتصفح..

background-attachment: القيمة ;

القيم المتاحة:

• fixed : ثابت
• scroll : متحرك

6- Background

اختصار لجميع الخواص السابقة .. يمكنك تحديدها جميعا في سطر واحد مثال

background: #000000 url(images/back.gif) center right no-repeat scroll;

بعد background توضع الخواص التالية بالترتيب ..

• background-color : لون الخلفية
• background-image : الصورة
• background-repeat : تكرار الخلفية
• background-attachment : ثبات الصورة
• background-position: موقع الخلفية

• اضيف  في 29 يناير 2008
• الزوار : [ 4,759 قارئ ]
• هذا الموضوع مرخص وفق ترخيص Creative Commons.[ معلومات إضافية حول الترخيص بالعربية]