الدرس 2: الصيغة العامة لنمط CSS

css2
ظهرت الحاجة لاستخدام تقنية
CSS بعد اهتمام المتصفحات الشهيرة مثل Internet Explorer و Netscape بإضافة وسوم HTML أخرى .قامت جمعية W3C باعتماد هذه التقنية لتساعد على نقل المواقع القديمة التي لا تحتوي على وسوم التنسيق إلى مواقع حديثة من صفحات إنترنت.

ملاحظة: W3Cهو اختصار لـ Word Wide WebConsortium وهي الجمعية المسؤولة عن إصدار نسخ قياسية من لغة HTML.

تحدد الأنماط التنسيق لأوسمة لغة HTMLبمعنى أننا نستطيع تحديد تنسيق معين لوسم الفقرة أو وسم الجداول أو غيرها من الوسوم HTML, إذا فالصيغة العامة لنمط CSSستتكون من وسم HTMLالذي سيطبق عليه النمط و التنسيق :

 الـوسم{ القيمة :المتغير}

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


أمثلة :

body  { border-style : solid }

h2    { color : #5660000 }

table { border-right-style : solid }

a { color : #005000;font-size :1em }                  

p { border-style : solid ; border-color : #F990FF }

h1,h2,h3,h4,h5,h6{ color : #0560000}

 


ملاحظات :

1- لا شك أنك لا زلت تذكر الوسم body الوسم الخاص بجسم الصفحة والوسم h2 الخاص بوسوم رأس الفقرة و table الخاص بالجداول إذا وجدت صعوبات أو مشاكل في تذكر ذلك فعد إلى الحصص الدراسية للغة HTML.

2- إن بعض أسماء المتغيرات في لغة CSS تختلف قليلا عن أسماء هذه المتغيرات في لغة HTML لهذا ستجد في دروس قادمة لوائح لأسماء المتغيرات الخاصة بلغة CSS لكل وسم مع الوظائف التي تمنحها لك.

3- والآن هل لاحظت المثالين ما قبل الأخير؟ إن كل واحد منهما يحتوي على متغيرين بدلا من متغير واحد و قد قمنا  بفصل المتغيرات المختلفة باستخدام الفاصلة المنقوطة.

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

5- ربما تريد تجربة ما تعلمناه إلى حد الآن! لكن هذا لن يتأتى لك إلا إذا تابعت معنا باقي الدروس حيث ستتعرف على طريقة إدراج الأنماط في ملف HTML. 

أضف تعليق


كود امني
تحديث


Go to top