مفهوم أطر عمل CSS في معايير الويب

لقد رأيت مؤخرًا الكثير من المقدمات حول أطر عمل CSS، وقد قلت شيئًا ما قبل بضعة أيام: "في مجال رؤيتي المحدود، لم أر أي شيء يمكن تسميته حقًا بإطار عمل CSS ~". قد يكون مجال رؤيتي صغيرًا جدًا، أو العالم كبيرًا جدًا، وما زلت أشعر أنه لا يزال هناك الكثير من الأشياء التي لا أستطيع رؤيتها.

دعونا نلقي نظرة أولاً على المفهوم الذي أتفق معه:

يمكن تقسيم الإطار إلى نوعين: الصندوق الأبيض والصندوق الأسود.

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

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

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

دعونا نلقي نظرة على العديد من أطر عمل CSS الموجودة على الإنترنت اليوم (تسمى YUI "أدوات CSS لمكتبة YUI" بدلاً من "أطر عمل YUI CSS"). ما عليك سوى تحديد الفئات الأساسية للنمط. وبطبيعة الحال، قد لا يكون فهم الجميع للإطار هو نفسه، وقد لا توافق على ما أقول.

لنتحدث عن إطار عمل CSS مرة أخرى، لا يعني ذلك أنني لا أدرك وجود هذا الشيء، فأنا أحاول القيام بمثل هذه الأشياء منذ عام أو عامين. بالنسبة لمواقع الويب الكبيرة، يتطلب تطوير الواجهة الأمامية حلاً. الإطار هو بطبيعة الحال الخيار الأول. من المؤسف أنه بعيد جدًا عني وأنا ضعيف جدًا T_T أحتاج فقط إلى شيئين:

شيء لإدارة المحتوى أدناه

الفئة/المكون

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

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

على نفس موقع الويب، من الطبيعي أن يتم استخدام كتل محتوى مماثلة عدة مرات، وهذا أيضًا يجعل من الممكن إجراء عملية نمطية، مثل قائمة الصور، أو قائمة الصور الرمزية للمستخدم، أو قائمة أيقونات المجموعة هل يجب كتابة نفس الكلمات بهذه الطريقة؟

.photoListUesr,.photoListGroup{ /*_*/ }

هذا لا يعني أنه مستحيل، ولكن ماذا لو أردت فجأة إضافة شيء مماثل في هذا الوقت، قد تحتاج إلى تعديل النمط؟ ماذا عني حاولت استخدامه مثل هذا:

<div class="photoList UesrCt" />
<div class="photoList GroupCt" />