الدرس22 : تطبيق نمط class و id في لغة html5 و css3

 تطبيق نمط class و id :

ما تعلمناه سابقا صحيح لكن متلا عندما كتبنا أن النصوص تصبح بالأزرق فجميع النصوص سوف تصبح كدلك، ولكن أنا أريد نصا معينا  يصبح بالأزرق وآخر بالأحمر ... ستقول نضيف الستايل في الوسم كما تعلمنا سابقا. سأقول لك لا، لأنه قلت لك أحسن طريقة هي عمل صفحة css مستقلة. إدا الحل هو تطبيق سمات class و id .
كلا هاتين السمتين تستعملان لإعطاء إسم لوسم ما لنستعمله في css . الفرق بينهما بسيط سأتكلم عليه في آخر هذا الدرس.

 تطبيق نمط class :

يدرج هذا النمط بالطريقة التالية:
class="">

class="">


class="" />
class="" />
site html
كما نلاحظ فقط النص الدي يحمل "class="tarhib هو الدي تغير لونه للأزرق .

 تطبيق نمط id :

له نفس دور class تقريبا . لكن لا يمكن إعطاء إسم id معين أكتر من مرة. و هو يستعمل أيضا في JavaScript. ولقد سبق ورأينا هدا السمة في درس الروابط. و باتصار سنستعمل في الأشياء التي توجد مرة واحدة في الصفحة كلوجو متلا وهذا متال:
src="images/logo.png" alt="Logo alkhabire" id="logo" />
و لإدراج هدا الإسم الذي أعطينا id إياه في لغة css يجب كتابة قبل الإسم # كما يبين الكود التالي:
#logo
{
/* الأكواد تضاف هنا: */
}
لم نجرب id لأنها تعمل متل class يمكنك تجربة ذلك بنفسك. فالفرق بينهما هو ما دكرته سابقا.و كان هذا درس بسيط لكنه مهم لأننا سنحتاجه كتيرا في الدروس السابقة. لأي إستفسار أو تشجيع يمكنك ترك تعليقك و شكرا.

تعليقات

المشاركات الشائعة من هذه المدونة

حصري : حل مشكلة انوي 15 دقيقة

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

موقع لتحديد سرعة تحميل موقعك Website speed test