الفصل التاسع

تكنولوجيا أوراق الأنماط المتعاقبة

CSS

تكنولوجيا أوراق الأنماط المتعاقبة

لابد أنك لاحظت أن لكل علامة  Tagمن علامات لغة HTML توجد إعدادات افتراضية، فمثلاً عند استخدامك للعلامة <P> لكتابة فقرة جديدة، فإن النص الذي تكتبه يظهر فغي صفحة الوبWeb Page  بلون خط أسود وله حجم وشكل معين. ولكن عندما تريد تغيير الإعدادات الافتراضية لأي علامة Tag من علامات لغة HTML، ففي هذه الحالة يجب استخدام تكنولوجيا أوراق الأنماط المتعاقبة (CSS) Cascading Style Sheets

تستخدم تكنولوجيا أوراق الأنماط المتعاقبة (CSS) Cascading Style Sheets عند الحاجة لتغيير الإعدادات الافتراضية لأي علامة Tag من علامات لغة  لHTML، وتتم على مرحلتين: المرحلة الأولى هي كتابة التنسيقات المطلوبة باستخدام أوامر CSS، والمرحلة الثانية هي كتابة ملف بلغة HTML يستخدم التنسيقات الموجودة في أوامر CSS.

بالنسبة للمرحلة فإننا نختار أي علامة Tag من علامات لغة HTML ثم نكتب التنسيقات المطلوبة وبعد ذلك يتم حفظ الملف بامتداد extensuin يسمى CSS.

أي أن الشكل العام لملف CSS يكون كالتالي:

حيث يتم علامة Tag التينريد تغ7يثير إعداداتها مثل العلامة <P> التي تستخدم في كتابة الفقرات، ثم يتم فتح القوس ثم يتم كتابة الأوامر المطلوبة بتكنولوجيا CSS كما سنري لاحقاً ثم يتم إغلاق القوس، ثم نقوم بحفظ الملف بامتداد extension يسمي CSS بعد انتهائنا من كتابة الأوامر المطلوبة.

أما المرحلة الثانية فهي إنشاء ملف إمتداد extension يسمى HTML كما تعلمنا في الفصول السابقة ولكن يزيد فقط سطر واحد لتحديد اسم الملف الذي يحتوي على أوامر تكنولوجيا CSS المطلوبة، ويتم كتابة هذا السطر من خلال العلامة <HEADS> ويأخذ هذا السطر الشكل العام التالي:

 

حيث يتم استخدام العلامة <LINK> مع الصفة HREF ثم تحديد اسم الملف الذي يحتوي على أوامر CSS المطلوبة ثم الصفة REL لتحديد نوع الملف ليكون ملف أنماط Style Sheet ثم تحديد نوعه TYPE ليكون ملفاً نصيباً Text File من نوع CSS.

ففي المثال التالي سوف بتغيير تنسيق الفقرات باستخدام CSS، فقم كتابة الكود التالي داخل برنامج المفكرة Notepad:

ثم قم بحفظ هذا الكود داخل ملف بالامتداد CSS. وليكن (style. Css).

الآن قم بكتابة كود لغة HTML الذي يستخدم التنسيق المعد مسبقاً داخل الملف الخاص بـ css، وذلك كما يلي:

لاحظ أنه في السطر الرابع تمت الإشارة إلى اسم ملف css الذي سوف يتم تنسيق الفقرات وفقاً له والذي قمنا إعداده من قبل.