CSS لغة
CSS لغة

CSS لغة

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

على الرغم من أن أوامر HTML تخبر المتصفح أن أجزاء معينة من النص هي عناوين أو ترجمات أو روابط أو فقرات ، فإن لغة CSS هي ما يخبر المتصفح بالخطوط أو الحجم أو اللون أو المحاذاة التي يجب أن تحتوي على عنصر في الصفحة. هناك اختلاف كبير في طريقة عرض الموقع باستخدام أوامر CSS

لغة CSS هي اختصار لـ Cascade Style Sheets.

مع ظهور الإنترنت و HTML وتنوع المتصفح (التي ليست أكثر من برامج تسمح بتفسير المعلومات وعرضها على مواقع الويب) ، أصبح من الضروري توحيد الأوامر والجهد من قبل اتحاد شبكة الويب العالمية. (W3C) ظهرت  CSS الحالية.

لغة CSS ما هي أنماط ؟

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

بعبارة أخرى ، من الأسهل والأسرع ربط قالب HTML الخاص بك بملف  CSS بحيث يفهم المستعرض أنه يجب أن يعرض جميع عناوين H2 باللون الأزرق ، بدلاً من دمج أمر نمط منفصل لكل H2 تقوم بتضمينه في صفحاتك.

ميزة أخرى لـ CSS هي أنه يمكنك استخدام نفس القالب لتنسيق العديد من مواقع الويب ، وإذا كنت بحاجة إلى إجراء تغييرات ، فقم ببساطة بتعديل العنصر في القالب وتحديث المواقع المرتبطة.

ميزة أخرى لـ CSS هي أنه يمكنك استخدام نفس القالب لتنسيق العديد من مواقع الويب ، وإذا كنت بحاجة إلى إجراء تغييرات ، فقم ببساطة بتعديل العنصر في القالب وتحديث المواقع المرتبطة.

لغة CSS متى تستخدم ؟

سيكون تعلم إنشاء أوراق أنماط لغة CSS ضروريًا لتتمكن من تطوير صفحة ويب من الصفر ، أو لتخصيص أي تفاصيل تصميم للويب الذي تعمل معه.

تقدم لك العديد من المواقع مثل WordPress القدرة على الاختيار من قوالب أنماط مصممة مسبقًا وبناء صفحة ويب ببساطة عن طريق السحب والإفلات دون العبث بالشفرة ، ولكن بالنسبة لأي موقع يحتاج إلى مزيد من التخصيص ، تحتاج إلى اللجوء إلى البرمجة المباشرة. في HTML ، وبالتالي أوراق الأنماط المتتالية.

لغة CSS مكونات ورقة أنماط 

  • المحدد: هو العنصر الذي سيتم تطبيق نمط معين عليه ، يمكن أن يكون H1 ، H2 ، فقرة ، نموذج ، إلخ.
  • إقرار: يتكون من خاصية (اللون ، العرض ، الخط ، إلخ) وقيمة (أحمر ، صحيح ، محاذاة إلى اليسار ، إلخ).

إذا كان لدينا ، على سبيل المثال:

 
h1 {
color: red;
text–align: center;
}

نقوم بتوجيه المتصفح لعرض العنوان 1 للمستند باللون الأحمر والمتمركز.

اذا كان لدينا:

p {
font-size: 60px;
color: black;
text-align: left
}

نحن نطلب عرض الفقرات بحجم خط 60 بكسل ، أسود ومحاذاة إلى اليسار.

كيفية تطبيق CSS على مستند HTML؟

لنفترض أن لديك بالفعل مستند HTML الخاص بك وتريد تطبيق أوامر ورقة أنماط  CSS عليها. لديك طريقتان للقيام بذلك. الأول هو ربط HTML بمستند لغة CSS باستخدام رابط يتم وضعه في قسم الرأس (أي بين <head> و </head> من كود HTML) بالعنصر:

<link rel="stylesheet" type="text/css"

لغة CSS موارد لتعلم

يمكنك العثور على العديد من الموارد عبر الإنترنت للتعلم والتقدم في مهارات تخطيط CSS. نذكر هنا بعض أفضل ما وجدناه:

CSS Introduction – De W3schools
 
 
CSS Beginner Tutorial – De HTMLDog

Deja una respuesta