مُحدِّدات CSS 2.1 | الجزء الثاني

هذا هو الجزء الثاني من سلسلة مكونة من ثلاثة أجزاء تشرح المحددات المتوفرة في CSS 2.1. الجزء الأول كان عن الأساسيات مثل المحدد النوعي، ومحدد الفئة والمعرف، والمحدد العالمي، ومحددات بسيطة.

أدوات الدمج

تستخدم أدوات الدمج للفصل بين محددين بسيطيين -أو أكثر- المكونة لمحدد مركب. أدوات الدمج المتوفرة هي المسافة -سواءاً مسافة واحدة أو أكثر- و > و +. وظيفة كل أداة مشروحة في الأقسام التالية.

محددات السُلالة

يتكون محدد السليل من محدديين بسيطين -أو أكثر- مفصولين بمسافة. ينطبق هذا المحدد على سلاسة العناصرالتي ينطبق عليها المحدد البسيط الأول. مثلاً: ستطبق القاعدة في المحدد التالي على جميع عناصر p المنحدرة من عنصر div:

div p { color:#f00; }

يمكن لمحددات السلالة أن تتكون من أي شكل من أشكال المحددات البسيطة. ستطبق القاعدة التالية على جميع عناصر p ذات الفئة info والتي تنحدر من العنصر li المنحدر بدوره من العنصر div ذا المعرف myid:

div#myid li p.info { color:#f00; }

محددات السلالة تسمح لك باستهداف عناصر دون الحاجة لإعطائها فئةً أو معرفاً، مما يساعد على نظافة نصِّك. لنفترض أن لديك قائمة تصفح كما يلي:

 

لتستهدف نقاط القائمة وروابطها فقط، تقوم باستخدام الـ CSS التالي:

#nav li { display:inline; } 
#nav a { font-weight:bold; } 

أكمل القراءة

أماني CSS

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

إمكانية تحديد هيكل الصفحة

أكمل القراءة

103 تصميم المواقع – الفصل بين المحتوى والتصميم

بعد أن عرفنا أن الموقع يتكون من المحتوى والتصميم، سنناقش في هذه المقالة فكرة الفصل بين المحتوى والتصميم.

الفصل بين المحتوى والتصميم الذي نتحدث عنه هو من جهة المصمم -أو المطور- وليس من جهة زوار الموقع، كما قد يتبادر إلى الأذهان. حيث يكون هذا الفصل -تحديداً- بين هيكل الصفحة المتمثل في XHTML وطريقة عرض أو تقديم الصفحة المتمثلة -بشكل أساسي- في CSS.

ما هو CSS؟

هو عبارة عن لغة بسيطة وضعت للتحكم في طريقة تقديم محتوى صفحات المواقع، وذلك باستخدام XHTML Tags، واستخدام Classes يتم تعريفها من قبل المطور لتستخدم في وسط XHTML Tags.

كيف يكون الفصل بين المحتوى والتصميم؟

يكون الفصل بين المحتوى والتصميم بغياب أي عنصر متحكم في طريقة التقديم –بحد ذاته- من المحتوى. من أمثلة هذه العناصر: <font> و <span style=”color:#000000;”>.

لماذا نفصل؟ أكمل القراءة