تاريخ النشر: 17 يوليو 2026
مرحبًا بك مرة أخرى في الملخّص الشهري لـ Baseline. في يونيو 2026، أصبحت الميزة field-sizing متاحة حديثًا في Baseline، ما يسمح لعناصر التحكّم في النماذج بالتكيّف تلقائيًا مع محتواها. في الوقت نفسه، وصلت مجموعة كبيرة من ميزات CSS وHTML وWeb API إلى حالة "متاحة على نطاق واسع" في Baseline، بالإضافة إلى تحديثات مهمة من منتدى المطوّرين.
تنبيهات Baseline بشأن حالة "المنصة الإلكترونية"
أصبح من الأسهل الآن تتبُّع وقت توافق ميزات الويب مع بعضها البعض باستخدام "تنبيهات Baseline" في لوحة بيانات حالة "المنصة الإلكترونية". من خلال تسجيل الدخول باستخدام GitHub، يمكنك الاشتراك في تلقّي إشعارات بشأن الميزات عندما تصبح متاحة حديثًا أو متاحة على نطاق واسع أو تتلقّى عمليات تنفيذ جديدة في المتصفّح. يمكنك ضبط الاشتراكات لإرسال تحديثات عبر البريد الإلكتروني أو خلاصات RSS مخصّصة على أساس شهري أو أسبوعي أو فوري. يمكنك حصر التنبيهات في عمليات البحث المحفوظة، مثل جميع ميزات HTML، أو إنشاء نشرات إخبارية مخصّصة أو إنشاء قوائم ميزات قابلة للمشاركة أو ضبط روابط ويب لـ Slack لإرسال إشعارات إلى فريقك الهندسي.
مزيد من المعلومات في مقالة تقديم "تنبيهات Baseline"
الميزات المتاحة حديثًا في Baseline
تتوفّر الميزات الواردة في هذا القسم اعتبارًا من يونيو 2026 في مجموعة المتصفّحات الأساسية، وأصبحت الآن متاحة حديثًا في Baseline.
field-sizing
توفر السمة field-sizing في CSS إمكانية التحكم في سلوك تغيير حجم
عناصر النموذج، مثل <textarea> و<input> و<select>، التي تكون لها عادةً
أبعاد تلقائية ثابتة. باستخدام field-sizing: content، تتوسّع عناصر التحكّم في النماذج أو تتقلّص تلقائيًا لتناسب محتواها، ما يقلّل من الحاجة إلى النصوص البرمجية المخصّصة لتغيير الحجم تلقائيًا في JavaScript.
مزيد من المعلومات في صفحة مرجع MDN لـ field-sizing.
الميزات المتاحة على نطاق واسع في Baseline
أصبحت الميزات التالية متاحة على نطاق واسع في Baseline، ما يعني أنّها متوافقة الآن على نطاق واسع ويمكن استخدامها في مشاريعك.
الفئة الزائفة :has()
تتيح لك أداة اختيار العنصر الرئيسي :has() في CSS تنسيق عنصر استنادًا إلى العناصر التابعة له أو العناصر اللاحقة له. تتيح هذه الفئة الزائفة الوظيفية أنماط التنسيق الشرطية مباشرةً في CSS بدون الحاجة إلى JavaScript لفحص بُنى نموذج العناصر في المستند (DOM).
مزيد من المعلومات في صفحة MDN للفئة الزائفة :has pseudo-class.
HTMLIFrameElement.loading
تتيح السمة loading في عناصر <iframe> التحميل المؤجّل للإطارات المضمّنة. من خلال تحديد loading="lazy"، تؤجّل المتصفّحات تحميل عناصر iframe خارج الشاشة
إلى أن يتم التمرير بالقرب من إطار العرض، ما يؤدي إلى توفير نطاق الشبكة الترددي وتقليل وقت تحميل الصفحة الأولي.
اطّلِع على التفاصيل في مرجع MDN لـ HTMLIFrameElement.loading.
CanvasRenderingContext2D.reset()
يزيل الأسلوب reset() في سياقات لوحة الرسم الثنائية الأبعاد حالة سياق الرسم، ما يؤدي إلى إعادة ضبط الخصائص، مثل عمليات التحويل ومسارات القص وأنماط الخطوط وأنماط التعبئة، إلى قيمها التلقائية. يسمح ذلك بإعادة استخدام سياق لوحة الرسم بشكل نظيف بدون تنظيف الخصائص يدويًا.
مزيد من المعلومات في مستندات MDN لـ CanvasRenderingContext2D.reset.
وحدة الطول cap
تتوافق الوحدة cap المستندة إلى الخط مع ارتفاع الحرف الكبير الاسمي لخط العنصر. تتيح لك محاذاة العناصر وتغيير حجمها بالنسبة إلى ارتفاع الأحرف الكبيرة، ما يتيح تنسيقات طباعية دقيقة.
مزيد من المعلومات في مرجع MDN لوحدات الطول.
السمة counter-set
تضبط السمة counter-set في CSS عدّاد CSS على قيمة محدّدة، ما يكمّل counter-reset وcounter-increment. توفّر هذه السمة إمكانية التحكّم عند معالجة القوائم المرقّمة أو مخططات المستندات أو تسلسلات العدادات المخصّصة.
اطّلِع على التفاصيل في صفحة MDN لـ counter-set.
createImageBitmap()
ينشئ الأسلوب الثابت createImageBitmap() صورة نقطية غير متزامنة
من مصادر صور مختلفة، بما في ذلك <img> أو <canvas> أو Blob أو
ImageData. بما أنّه يفك ترميز الصور خارج سلسلة التعليمات الرئيسية، فإنّه يتجنّب حظر أداء واجهة المستخدم عند معالجة رسومات لوحة الرسم المعقّدة.
اطّلِع على تفاصيل التنفيذ في مستندات MDN لـ createImageBitmap.
نوع البيانات <easing-function>
يصف نوع البيانات <easing-function> في CSS منحنيات معدّل التغيير الرياضي
للانتقالات والرسوم المتحركة. بالإضافة إلى الكلمات الرئيسية العادية، مثل ease-in أو cubic-bezier()، فإنّه يتيح استخدام دوال، مثل linear()، لإنشاء تأثيرات مخصّصة للزنبرك أو الارتداد.
تعلَّف على كيفية استخدامه في مرجع MDN لـ easing-function.
أداة اختيار التداخل &
تربط أداة اختيار التداخل & بشكل صريح أدوات اختيار قواعد العناصر التابعة بأداة اختيار العنصر الرئيسي عند استخدام التداخل المضمّن في CSS. تضمن هذه الأداة الوضوح وقواعد التحديد الصحيحة عند تحديد حالات التمرير أو التركيز أو الفئة الزائفة المتداخلة.
اطّلِع على التفاصيل في دليل MDN لأداة اختيار التداخل selector.
التحميل المسبق المتجاوب باستخدام rel="preload"
تتيح السمة media في عناصر <link rel="preload"> التحميل المسبق المتجاوب
للأصول الرئيسية. من خلال الجمع بين rel="preload" وطلبات البحث عن الوسائط،
لا تنزّل المتصفّحات إلا الأصول التي تتطابق مع عرض إطار عرض المستخدم أو خصائص العرض
في وقت مبكر من دورة التحميل.
تعرَّف على كيفية استخدامه في مستندات MDN لـ rel="preload".
HTMLMediaElement.preservesPitch
تتحكّم السمة preservesPitch في عناصر <audio> و<video> في ما إذا كان المتصفّح يضبط درجة الصوت عند تغيير playbackRate.
يؤدي ضبط هذه السمة على false إلى السماح بتغيير درجة الصوت عند تسريع تشغيل الوسائط أو إبطائه.
اطّلِع على التفاصيل في صفحة MDN لـ HTMLMediaElement.preservesPitch.
الفئة الزائفة :dir()
تطابق الفئة الزائفة :dir() في CSS العناصر استنادًا إلى اتجاه النص
(مثل ltr أو rtl)، ما يطابق الاتجاه الموروث من سمات HTML، مثل
dir أو سياق النص المحسوب.
مزيد من المعلومات في صفحة MDN للفئة الزائفة :dir pseudo-class.
الدالة الرياضية pow()
تحسب الدالة pow() في CSS قيم الأسس مباشرةً ضمن تصريحات CSS، ما يؤدي إلى رفع رقم أساس إلى أس (مثلاً، pow(2, 3)). يؤدي ذلك إلى تبسيط تغيير الحجم المتجاوب والعلاقات الرياضية للشبكة.
اطّلِع على التفاصيل في مرجع MDN للدالة pow function.
السمة mask في CSS
تخفي السمة mask المختصرة في CSS أجزاء من عنصر باستخدام الصور أو التدرجات كطبقات قص. تجمع هذه السمة بين السمات الفرعية، مثل mask-image وmask-position وmask-repeat، لإنشاء تأثيرات إخفاء مرئية معقّدة.
مزيد من المعلومات في صفحة MDN للسمة mask property.
@media (scripting)
تختبر ميزة الوسائط scripting ما إذا كانت النصوص البرمجية من جهة العميل (مثل JavaScript) مفعّلة ومتاحة في سياق المتصفّح. يسمح ذلك لأنماط التحسين التدريجي باستهداف البيئات التي تتضمّن JavaScript نشطًا أو لا تتضمّنه.
مزيد من المعلومات في مرجع MDN لميزة الوسائط scripting.
URL.canParse()
يتحقّق الأسلوب الثابت URL.canParse() مما إذا كانت السلسلة المقدّمة عنوان URL صالحًا،
وقابلاً للتحليل (مع عنوان URL أساسي اختياري) بدون عرض استثناء،
ما يسهّل عملية التحقق من صحة عنوان URL في وقت التشغيل قبل إنشاء كائنات URL
اطّلِع على تفاصيل التنفيذ في مستندات MDN لـ URL.canParse.
Storage Access API
تقدّم واجهة برمجة التطبيقات Storage Access API آلية للمحتوى المضمّن من مواقع إلكترونية مختلفة داخل عناصر <iframe> تابعة لجهات خارجية لطلب الوصول إلى ملفات تعريف الارتباط ومساحة التخزين غير المقسّمة، ما يتيح المصادقة والتفاعلات المستندة إلى الحالة عبر حدود النطاق.
اطّلِع على التفاصيل في صفحة MDN لواجهة برمجة التطبيقات Storage Access API.
الخاتمة
أخبرنا إذا فاتنا أي شيء ذي صلة بـ Baseline، وسنتأكّد من تضمينه في إصدار مستقبلي. إذا كانت لديك أي أسئلة أو أردت تقديم ملاحظات حول Baseline، يمكنك تسجيل مشكلة في أداة تتبُّع المشاكل.