مقدمة في لغة CSS: تنسيق صفحات الويب – الإعلام الآلي — السنة الأولى ثانوي (جذع مشترك علوم وتكنولوجيا) — المنهاج الجزائري

مقدمة في لغة CSS: تنسيق صفحات الويب

CSS (Cascading Style Sheets) هي لغة تنسيق تستخدم للتحكم في مظهر صفحات الويب. تفصل CSS بين محتوى الصفحة (HTML) وتصميمها.

طرق إضافة CSS

• داخلي (Inline): باستخدام خاصية style داخل عنصر HTML
• داخلي (Internal): باستخدام عنصر style في رأس الصفحة
• خارجي (External): باستخدام ملف CSS منفصل يربط بالصفحة عبر عنصر link

قواعد CSS الأساسية

القاعدة تتكون من: محدد (Selector) يحدد العنصر المراد تنسيقه، وإعلان (Declaration) بين قوسين {} يحتوي على خاصية (Property) وقيمة (Value). مثال: h1 { color: blue; font-size: 24px; }

المحددات الرئيسية

• محدد العنصر: باسم العنصر مثل p { }
• محدد id: باستخدام # مثل #header { }
• محدد class: باستخدام . مثل .highlight { }
• محددات متعددة: p, h1, div { }

خصائص أساسية

• الألوان: color, background-color
• الخطوط: font-family, font-size, font-weight
• الهوامش والحواف: margin, padding, border
• العرض والارتفاع: width, height
• الخلفية: background-image, background-repeat

تمارين

1. اكتب كود CSS يجعل عنوان h1 باللون الأحمر وحجم الخط 32 بكسل.
2. كيف تربط ملف CSS خارجي بصفحة HTML؟
3. ما الفرق بين margin و padding؟