ما هي CSS ولماذا وُجدت
CSS — أي Cascading Style Sheets — تتحكم في شكل HTML، والفصل بين البنية والمظهر هو جوهر الأمر.
- HTML هي البنية؛ وCSS هي الألوان والتباعد والخطوط والتخطيط
- تعيش الأنماط عادة في ملف
.cssخارجي واحد - تعيد تنسيق موقع كامل بتعديل ذلك الملف وحده
- هذا الفصل هو ما يجعل CSS "توفّر جهدًا كبيرًا"
البناء والطرق الثلاث لإضافتها
القاعدة محدّد مع كتلة تعريفات، وتضيف CSS بثلاث طرق.
- التعريف هو
property: value;— النقطتان تفصلان، والفاصلة المنقوطة تُنهي - خارجي — ملف
.cssيُربط بـ<link>؛ قابل لإعادة الاستخدام والتخزين (الأفضل) - داخلي — كتلة
<style>في<head>، لصفحة واحدة - سطري — خاصية
styleعلى عنصر واحد؛ الأكثر تحديدًا والأقل قابلية للصيانة
المحدّدات: اختيار ما تنسّقه
المحدّد يوجّه CSS إلى العناصر التي تقصدها.
- element (
p) — يطال كل وسم مطابق - id (
#one) — العنصر الوحيد بذلك الـ id، ويجب أن يكون فريدًا - class (
.center) — كل عنصر بتلك الـ class، حصان العمل القابل لإعادة الاستخدام - التجميع (
h1, h2, p) — عدة محدّدات تتشارك قاعدة واحدة - الشامل (
*) — يطابق كل عنصر دفعة واحدة
الخلفيات والنص والخطوط والروابط
للّون ثلاث صيغ متكافئة، وللروابط أربع حالات تنسّقها بالترتيب.
- اللون: اسم (
red)، أو HEX (#ee3e80)، أوrgb(255, 0, 0) - الخلفيات:
background-imageوbackground-repeatوbackground-attachment: fixedوbackground-position - النص:
colorوtext-alignوdirection(rtlللعربية) وtext-decorationوtext-transformوالتباعد - الخطوط:
font-family(أنهِ القائمة بعائلة عامة) وfont-styleوfont-size - الروابط:
a:linkوa:visitedوa:hoverوa:active— اكتبها بهذا الترتيب وإلا فشلت المتأخرة