العنصران و
يستخدمان لجمع العناصر وإنشاء هيكلية للوثائق وهما يستخدمان معاً مع الخاصيتين class وid.
في هذ االدرس، سنلقي نظرة عن قريب على استخدام و
في هذ االدرس، سنلقي نظرة عن قريب على استخدام و
لأنهما العنصران الأكثر أهمية عندما تتعامل مع CSS.
- التجميع بالعنصر
- التجميع بالعنصر
التجميع بالعنصر
العنصر هو ما يمكن أن تسميه العنصر المحايد والذي لا يضيف شيئاً للوثيقة نفسها، لكن مع CSS يمكن استخدامه لإنشاء مؤثرات على أجزاء محددة من النص في الوثائق.
مثال هذا هو اقتباس من جملة قالها بنجامين فرانكلين:Early to bed and early to rise
makes a man healthy, wealthy and wise.
لنقل أننا نريد أن نؤكد على ما قاله السيد فرانكلين حول فوائد عدم
النوم في النهار بأن نلونها بالأحمر، لهذا الغرض يمكن وضع الكلمات بين
وسمي ، كل span أضفنا لها فئة class والتي تمكننا بعد ذلك من إضافة خصائص لها من خلال CSS:Early to bed and early to rise
makes a man healthy,
wealthy
and wise.
أوامر CSS المتعلقة بالمثال:
span.benefit {
color:red;
}- [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
بالطبع يمكنك استخدام المعرف id لإضافة الألوان على
لكن تذكر أن استخدام المعرف يجب أن يكون لمرة واحدة في الصفحة الواحدة،
لذلك في المثال أعلاه عليك أن تستخدم ثلاث معرفات متميزة لكل كما تعلمت في الدرس الماضي.
التجميع بالعنصر
العنصر يستخدم في العناصر كما رأيت في المثال السابق، العنصريستخدم لتجميع العناصر.
هذا هو الاختلاف الوحيد، تجميع العناصر باستخداميعمل بنفس الطريقة، لنلقي نظرة على مثال لقائمتين تحويان أسماء الرؤساء الأمريكيين مقسمة حسب الأحزاب التي ينتمون لها:- فرانكلين روزفيلت
- هاري ترومن
- جون كينيدي
- ليندون جونسون
- جيمي كارتر
- بيل كلينون
- دوايت أيزنهاور
- ريتشارد نيكسون
- جيرالد فورد
- رونالد ريغان
- جورج بوش
- جورج دبليو بوش
وفي ملف CSS سنستخدم التجميع كما في المثال أعلاه بنفس الطريقة:
#democrats {
background:blue;
}
#republicans {
background:red;
}- [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
في الأمثلة لاسابقة استخدامناو
بشكل بسيط جداً، بتعديل لون الخلفية والنص، يمكن للعنصرين أن يقدما الكثير
من الإمكانيات المتقدمة، على أي حال، لن نتحدث عن هذا حالياً، سنتناول هذا
الموضوع لاحقاً فيانتظرووووووووو
الدرس القادم
- [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]
hassan_dmar- عضو ماهر
- النادى المفضل :
الجنسيه :
مزاجك ايه :
هوايتى :
المهنة :
الجنس :
عدد المساهمات : 184
نقاط العضو : 10551
شعبية العضو : 4
الموقع : اول لفة على ايديك اليمين
العمر : 29
تاريخ التسجيل : 16/08/2010
اوسمتى :
اوسمتى 2 :
اوسمتى 3 :
دعائى يارب تقبله :
- مساهمة رقم 2
رد: الدرس 7: تجميع العناصر باستخدام span وdiv
AbU ALi ElA$Sa$Y- AbU Ali ElAsSaSy SiTe EmPeRoR
- النادى المفضل :
الجنسيه :
مزاجك ايه :
هوايتى :
المهنة :
الجنس :
عدد المساهمات : 3295
نقاط العضو : 47459
شعبية العضو : 1740
الموقع : عايش فى منتدى العساسيه
العمر : 31
تاريخ التسجيل : 22/05/2009
اوسمتى :
اوسمتى 2 :
اوسمتى 3 :
دعائى يارب تقبله :
بطاقة الشخصية
شات المنتدى:
- مساهمة رقم 3
رد: الدرس 7: تجميع العناصر باستخدام span وdiv
شكرااااااااااا لمرورك
hassan_dmar- عضو ماهر
- النادى المفضل :
الجنسيه :
مزاجك ايه :
هوايتى :
المهنة :
الجنس :
عدد المساهمات : 184
نقاط العضو : 10551
شعبية العضو : 4
الموقع : اول لفة على ايديك اليمين
العمر : 29
تاريخ التسجيل : 16/08/2010
اوسمتى :
اوسمتى 2 :
اوسمتى 3 :
دعائى يارب تقبله :
- مساهمة رقم 4
رد: الدرس 7: تجميع العناصر باستخدام span وdiv
:)