منتديات أحلى استايل
هل تريد التفاعل مع هذه المساهمة؟ كل ما عليك هو إنشاء حساب جديد ببضع خطوات أو تسجيل الدخول للمتابعة.


منتدى عام وتقنى ودعم
 
دخولدخول  التسجيلالتسجيل  الرئيسيةالرئيسية  
 

 [الدرس الثاني] الألوان و الخلفيات

اذهب الى الأسفل 
4 مشترك
كاتب الموضوعرسالة
Dawn birth
Member
Member
Dawn birth


سجل فى : 01/10/2007

المساهمات : 2338
العمر : 35
التقييم : 3
من ..
ذكر
اعمل ..
احب ..

[الدرس الثاني] الألوان و الخلفيات Empty
مُساهمةموضوع: [الدرس الثاني] الألوان و الخلفيات   [الدرس الثاني] الألوان و الخلفيات I_icon_minitimeالسبت 26 سبتمبر 2009, 8:07 am

السلام عليكم ورحمة الله وبركاته
....................................
في هذا الدرس سنتعرف على تطبيق تغيير الألوان ولاخلفيات ووضع الخلفية
اولا الألون:
لتطبيق لون على عنصر html نستخدم الخاصية color
مثلا لنجعل العنوان h1 باللون الأحمر :
الكود:
h1{
color:red;
}
أو
الكود:
h1{
color:#FA0000;
}
لتطبيق لون على الخلفية نستخدم الخاصية
background-color
لو أردنا خلفية الصفحة باللون الأسود سيكون الرمز هو
الكود:
body{
background-color:#000000;
}
و كذلك لأي عنصر
فأيضا لو أردنا خلفية العنوان h1 باللون الأبيض سيكون الرمز هو
الكود:
h1{
color:red;
background-color:white;
}
هذا عن الألوان فماذا عن الخلفيات؟؟
طبعا لو أردنا ان تكون الخلفية لونا معينا سنطبق كما سبق لكن لو أردنا أن نضع صورة للخلفية سنستخدم الرمز
background-image
يعني لو أردنا وضع صورة كخلفية للصفحة سيكون الرمز هو:
الكود:
body{
background-image:url('back.jpg');
}
خصائص الخلفية:
التكرار:
يمكن التحكم في تكرار الخلفية فالوضع الافتراضي انك لو وضعت خلفية للصفحة ستتكرر
لتملأ الصفحة
ويمكن التحكم في تكرار الخلفية عن طريق الرمز
background-repeat
يعني لو أردت مثلا أن اجعل الخلفية تتكرر رأسيا فقط سيكون الرمز هو
body{
background-image:url('back.jpg');
background-repeat:repeat-y;
}
و يمكن استخدام
repeat-x للتكرار الافقي فقط
repeat للتكرار رأسيا و أفقيا
no-repeat لعدم التكرار
تثبيت الخلفية:
يمكن التحكم في ثبوت الخلفية عن طريق
background-attachment
و معنى ثبوت الخلفية أن تظل مكانها و لا تتحرك مع الصفحة صعودا وهبوطا
لو أردنا فعل ذلك لخلفية الصفحة و جعلها ثابتة سيكون الرمز هو
الكود:
body{
background-color:#000000;
background-image:url('back.jpg');
background-repeat:repeat-y;
background-attachment:fixed;
}
fixed خلفية ثابتة
scroll خلفية متحركة مع الصفحة صعودا و هبوطا
التحكم في مكان الخلفية:
يمكن التحكم في مكان الخلفية عن طريق
background-position
فممكن ان نجعلها في المنتصف أو بالاعلى او على اليمين أو اليسار او اعلى اليمين وهكذا
مستخدمين في ذلك القيم :
center
right
left
يعني مثلا لو أردنا ان نجعل خلفية الصفحة في أعلى اليمين سيكون الرمز :
الكود:
body{

background-color:#000000;

background-image:url('back.jpg');

background-repeat:no-repeat;

background-attachment:fixed;
background-position:top right;

}
يمكن أيضا التحكم في وضع الخلفية عن طريق الأرقام
يعني مثلا لو أردنا وضع الخلفية في ربع المسافة من من الاعلى و في منتصف المسافة أفقيا سيكون الرمز هو
الكود:
body{


background-color:#000000;


background-image:url('back.jpg');


background-repeat:no-repeat;


background-attachment:fixed;
background-position:50% 25%;


}
يمكن استخدام البكسل و السنتيميتر أيضا في تحديد موضع الخلفية بدلا من النسبة المئوية
مثلا لو أردنا ان تكون الخلفية على بعد 4cm من اليسار و 2cm من الاعلى سيكون الرمز هو
الكود:
body{



background-color:#000000;



background-image:url('back.jpg');



background-repeat:no-repeat;



background-attachment:fixed;

background-position:4cm 2cm;



}
يمكن جمع كل خصائص الخلفية في سطر واحد هكذا
الكود:
body{
background:#000000 url('back.jpg') no-repeat fixed top right;}
انتهى الدرس
المرة القادمة بغذن الله سيكون تطبيقا عمليا على الدرس

الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.bbcolors.com/
{ahmad}
Member
Member
{ahmad}


سجل فى : 12/10/2008

المساهمات : 474
التقييم : 0
ذكر

[الدرس الثاني] الألوان و الخلفيات Empty
مُساهمةموضوع: رد: [الدرس الثاني] الألوان و الخلفيات   [الدرس الثاني] الألوان و الخلفيات I_icon_minitimeالسبت 26 سبتمبر 2009, 6:32 pm

شكؤل بك
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://gr-l.yoo7.com
schoolel7ob
Member
Member
schoolel7ob


سجل فى : 11/12/2007

المساهمات : 360
العمر : 33
التقييم : 0
ذكر

[الدرس الثاني] الألوان و الخلفيات Empty
مُساهمةموضوع: رد: [الدرس الثاني] الألوان و الخلفيات   [الدرس الثاني] الألوان و الخلفيات I_icon_minitimeالثلاثاء 29 سبتمبر 2009, 5:18 pm

تسلم الايادى
الرجوع الى أعلى الصفحة اذهب الى الأسفل
http://www.arahman.yoo7.com
ساسوكي اوتشيها
Member
Member
ساسوكي اوتشيها


سجل فى : 28/09/2009

المساهمات : 229
التقييم : 1
ذكر

[الدرس الثاني] الألوان و الخلفيات Empty
مُساهمةموضوع: رد: [الدرس الثاني] الألوان و الخلفيات   [الدرس الثاني] الألوان و الخلفيات I_icon_minitimeالإثنين 09 نوفمبر 2009, 10:40 am

[الدرس الثاني] الألوان و الخلفيات C477a6fch22ese1
الرجوع الى أعلى الصفحة اذهب الى الأسفل
 
[الدرس الثاني] الألوان و الخلفيات
الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1
 مواضيع مماثلة
-
» الدرس الثاني من دروس الجليتر
» الدرس الثاني لللغه الصنيه ..
» الدرس ( 4 ) - [ صندوق الأدوات - الجزء الثاني ]
» الدرس الثاني في الجيم ميكر لصناعة الالعاب
» برنامج لعمل الخلفيات للموبايل الصينى جديد

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات أحلى استايل :: عالم الاكواد والتقنيات العامه :: تقنيات وشروحات اخرى-
انتقل الى:  
جميع الحقوق محفوظه لاكاديميه  احلى ستايل©ahlastylDigit@lالاعلى |الرئيسيه |قوانين المنتدى | احصائيات | احلى منتدى