شارك فريق Chrome بشكل كبير في مؤتمر CSS Day هذا العام. أطلقنا مكتب مساعدة CSS، وأجبنا عن أسئلة المشاركين، كما خصّصنا لوحًا أبيض سألنا فيه المشاركين عن الميزات التي يرون أنّها لا تزال غير متوفّرة في CSS. في هذا المنشور، سأشارك نتائج طرح هذا السؤال، وأطلب منك أيضًا إخبارنا بما تراه ناقصًا في HTML وCSS من خلال إكمال هذا الاستطلاع القصير. هل تتفق مع المشاركين في مؤتمر CSS Day؟
أهم عشرة طلبات
طُلب من المشاركين كتابة أفكار على ملاحظات لاصقة وإضافتها إلى اللوحة. يمكن للمستخدمين أيضًا إضافة أصواتهم إلى الأفكار من خلال إضافة ملصق. في ما يلي أهم عشر ميزات.
إتاحة إدخال الأنماط
كانت هذه الميزة الأكثر طلبًا، إذ حصلت على 21 صوتًا. أنت بحاجة إلى طرق لتصميم عناصر واجهة المستخدم الشائعة هذه بطريقة متّسقة.
نحن على دراية تامة بهذه المشكلة في Chrome، فهي من أبرز المشاكل التي يواجهها المطوّرون، ونعمل حاليًا على إيجاد حلول أفضل لها. على سبيل المثال، تهدف عناصر الاختيار القابلة للتخصيص إلى توفير طريقة لتفعيل سلوك التنسيق الجديد. يمكنك بعد ذلك تنفيذ إجراءات مثل إضافة صور أو حتى إضافة المزيد من الأنماط التفصيلية إلى الخيارات. تتميّز هذه الطريقة بأنّها ستعود إلى قائمة اختيار عادية، ما يتيح أن يكون هذا تحسينًا تدريجيًا.
مخفي بصريًا
حصل هذا الطلب على 19 صوتًا في "يوم CSS"، ما يجعله ثاني أكثر الطلبات رواجًا. تتضمّن الطلبات طريقة لإضافة محتوى لا تستخدمه سوى برامج قراءة الشاشة. قد يكون هذا العنصر عبارة عن عنصر HTML لا يتم عرض المحتوى فيه، بل تتم قراءته فقط بواسطة برنامج قراءة الشاشة.
يتم تحقيق ذلك عادةً من خلال إنشاء
فئة .visually-hidden
لإخفاء المحتوى مع إبقائه متاحًا لبرامج قراءة الشاشة.
على الرغم من أنّ هذا الطلب شائع، هناك أشخاص لا يرون أنّه يجب تنفيذه. للحصول على التفاصيل، يُرجى قراءة المحتوى المخفي بصريًا هو أسلوب مخادع يجب حله وليس ترسيخه وهذه المناقشة حول المشكلة 560 في مجموعة عمل CSS.
position: sticky inside overflow:hidden
حصل هذا الطلب على 16 صوتًا. في الوقت الحالي، لا تعمل position: sticky إلا عندما تكون جميع العناصر الرئيسية overflow: visible.
هناك مشكلة مفتوحة منذ عام 2017 تطلب ذلك،
وعلى الرغم من أنّ حالة الاستخدام الأولية
لإتاحة استخدام overflow: hidden لإزالة العناصر العائمة قد تكون أقل
طلبًا اليوم، هناك العديد من السيناريوهات الأخرى المفصّلة في سلسلة المحادثات.
التحريك إلى height: auto
عندما بلغ عدد الأصوات 12 صوتًا، أراد العديد من الضيوف أن تتحوّل الصورة إلى height: auto. يسرّنا أن نعلن أنّ هذه الميزة ستتوفّر على منصة الويب من خلال الخاصية interpolate-size والدالة calc-size() في CSS.
ستتوفّر هذه الميزات بدءًا من الإصدار 129 من Chrome.
سننشر مشاركة مستقبلية تتضمّن المزيد من المعلومات حول هذه الميزات.
أنواع الإدخال الإضافية
أتاحت لك HTML5 العديد من
الأنواع المختلفة للعنصر <input>،
مثل type="email" لعنوان البريد الإلكتروني أو type="range" لشريط تمرير النطاق.
في "يوم CSS"، حصلنا على 10 أصوات للمزيد من هذه الأنواع، مثل النطاق المزدوج أو الإكمال التلقائي باستخدام قائمة بيانات مخصّصة.
أرقام عشوائية حقيقية في CSS
كان هناك طلب آخر حصل على 10 أصوات للحصول على أرقام عشوائية حقيقية في CSS. تم طلب ذلك وتم إيجاد حلّ له في السابق بشأن animation-duration عشوائي.
فئات نمط Mixin
أضافت CSS عددًا من الميزات التي كانت متوفّرة سابقًا في معالجات CSS المسبقة، مثل المتغيّرات ذات الخصائص المخصّصة، بالإضافة إلى ميزة CSS Nesting. لم تصبح mixins القابلة لإعادة الاستخدام جزءًا من اللغة بعد، ولكن أبدى سبعة من المشاركين في CSS Day اهتمامهم برؤيتها.
صدر قرار عن فريق عمل CSS لبدء العمل على مواصفات هذه الميزة، ويمكنك إضافة أفكارك وحالات الاستخدام إلى المناقشة في تلك المشكلة.
الأنماط العامة في Shadow DOM
هناك مشكلة أخرى تتضمّن سلسلة مناقشات كبيرة حول حالات الاستخدام، وهي طلب السماح بتطبيق أنماط CSS العامة داخل Shadow DOM، وقد طلب ستة أشخاص ذلك في CSS Day. ستسمح هذه الإمكانية أيضًا بتطبيق أنماط إعادة الضبط العامة في مكوّنات الويب، كما ستتيح استخدام ملفات CSS الفردية في جميع مكوّنات الموقع الإلكتروني. يمكنك الاطّلاع على هذا الملخّص لحالات الاستخدام وإخبارنا إذا كانت هذه الميزة تهمّك أيضًا.
تقسيم الوحدات المختلطة
تم تقديم اقتراح بشأن Interop 2024
يطلب توفير إمكانية التقسيم حسب وحدات مختلطة، مثل calc(100vw / 1px). وقد تبيّن أنّ نطاقها واسع جدًا بالنسبة إلى Interop 2024، ولكن يرى العديد من المطوّرين، بمن فيهم ستة أشخاص حضروا فعالية CSS Day، أنّ من المفيد تنفيذها.
nth-letter
تتضمّن CSS عددًا من العناصر الزائفة التي تعمل كما لو كنت قد أضفت علامة span حول جزء من المحتوى. على سبيل المثال، يستهدف العنصر الزائف
::first-letter
الحرف الأول من السطر الأول في حاوية الكتلة
التي يتم تطبيقه عليها.
::nth-letter غير مدرَج في تلك القائمة، وقد طلبتم توفيره
::nth-letter منذ عشرين عامًا تقريبًا، لذا
نعلم أنّ مطوّري الويب يطلبون توفيره منذ فترة طويلة. في "يوم CSS"، صوّت ستة أشخاص على هذه الميزة، ما جعلها آخر ميزة ضمن قائمة أهم عشر ميزات مطلوبة.
هل توافق على قائمة أفضل 10 عروض تقديمية في مؤتمر CSS Day؟
يهمّنا معرفة رأي شريحة أوسع من الجمهور بشأن هذه المشاكل، فهل تندرج أيّ منها ضمن أهم عشر مشاكل تواجهك؟ إذا لم يكن الأمر كذلك، هل هناك ميزات أخرى تودّ أن تتوفّر في CSS وHTML؟ يُرجى إعلامنا بذلك من خلال ملء هذا النموذج المختصر وسنلخّص الردود في منشور آخر.