جدید به پلت فرم وب در ماه دسامبر

برخی از ویژگی‌های جالبی که در دسامبر ۲۰۲۵ به مرورگرهای وب پایدار و بتا اضافه شده‌اند را کشف کنید.

راشل اندرو

منتشر شده: ۱۶ دسامبر ۲۰۲۵

نسخه‌های پایدار مرورگر

کروم ۱۴۳ ، فایرفاکس ۱۴۶ و سافاری ۲۶.۲ در ماه دسامبر به نسخه پایدار منتشر شدند. این پست نگاهی به ویژگی‌های جدید فراوان این ماه می‌اندازد و چندین مورد به صورت پایه‌ای در دسترس قرار می‌گیرند.

اکنون at-rule مربوط به @scope در CSS به حالت پایه (Baseline) درآمده است.

فایرفاکس ۱۴۶ شامل @scope CSS at-rule است که به شما امکان می‌دهد عناصر را در زیردرخت‌های خاص DOM انتخاب کنید. یک محدوده تعریف کنید که در آن انتخابگرها بتوانند عناصر را هدف قرار دهند و از انتخابگرهای بیش از حد خاص و طولانی اجتناب کنید. به عنوان مثال، CSS زیر فقط عناصر <img> را در صورتی هدف قرار می‌دهد که درون عنصری با کلاس .card باشند.

@scope (.card) {
    img {
        border-color: green;
    }
}

با فایرفاکس ۱۴۶، این at-rule مفید اکنون به صورت Baseline New در دسترس است. برای اطلاعات بیشتر در مورد آن به بخش «محدود کردن دسترسی انتخابگرهایتان با @scope at-rule در CSS» مراجعه کنید.

تابع contrast-color() CSS

همچنین در فایرفاکس ۱۴۶ تابع contrast-color() وجود دارد. این تابع یک مقدار رنگ می‌گیرد و یک رنگ متضاد را برمی‌گرداند که هدف آن تضمین حداقل کنتراست WCAG AA است.

برای مثال‌های بیشتر، به بخش «چگونه مرورگر را وادار به انتخاب رنگ متضاد در CSS کنیم» در وبلاگ WebKit مراجعه کنید.

Browser Support

  • کروم: پشتیبانی نمی‌شود.
  • لبه: پشتیبانی نمی‌شود.
  • فایرفاکس: پشتیبانی نمی‌شود.
  • سافاری: ۲۶.

Source

فایرفاکس اولین مرورگری است که ویژگی text-decoration-inset را ارائه می‌دهد. این ویژگی به شما امکان می‌دهد نقاط شروع و پایان تزئین متن یک عنصر را تنظیم کنید تا بتوان آن را کوتاه، بلند یا موقعیت آن را نسبت به متن رندر شده تغییر داد.

ویژگی CSS با font-language-override

کروم ۱۴۳ شامل ویژگی font-language-override است. این ویژگی به شما امکان می‌دهد رفتار فونت را برای یک زبان خاص تغییر دهید. این ویژگی در صورتی مفید است که از فونتی استفاده می‌کنید که پشتیبانی مناسبی برای یک زبان ندارد، می‌توانید از گلیف‌هایی از زبان مشابه با پشتیبانی بهتر استفاده کنید.

Browser Support

  • کروم: پشتیبانی نمی‌شود.
  • لبه: پشتیبانی نمی‌شود.
  • فایرفاکس: ۳۴.
  • سافاری: پشتیبانی نمی‌شود.

Source

کوئری‌های کانتینر پشتیبان CSS

کروم ۱۴۳ @container anchored(fallback) ‎ را برای استایل‌دهی به فرزندان عناصر موقعیت‌یابی‌شده با anchor بر اساس اینکه کدام یک از position-try-fallbacks اعمال شده است، معرفی می‌کند.

چنین کوئری‌هایی می‌توانند برای استایل‌دهی به افسار یک عنصر لنگرگذاری شده یا انیمیشن‌های آن، بر اساس نحوه قرارگیری لنگر و عنصر لنگرگذاری شده نسبت به یکدیگر، مورد استفاده قرار گیرند.

سینتکس نسبی جانبی برای نوشته‌های طولانی background-position-x/y

همچنین در کروم، و اکنون در همه مرورگرها در دسترس است، امکان تعریف موقعیت تصویر پس‌زمینه نسبت به یکی از لبه‌های آن در ویژگی‌های longhand برای background-position وجود دارد. برای مثال:

.element {
  background-image: url(flower.gif);
  background-repeat: no-repeat;
  background-position-x: left 30px;
  background-position-y: bottom 20px;
}

Browser Support

  • کروم: پشتیبانی نمی‌شود.
  • لبه: پشتیبانی نمی‌شود.
  • فایرفاکس: ۴۹.
  • سافاری: ۱۵.۴.

ویژگی overallProgress انیمیشن

سافاری ۲۶.۲ شامل overallProgress است. این ویژگی فقط خواندنی از رابط انیمیشن، عددی بین 0 و 1 را برمی‌گرداند که نشان‌دهنده‌ی پیشرفت کلی انیمیشن به سمت حالت نهایی آن است.

این ملک اکنون به عنوان Baseline Newly در دسترس است.

Browser Support

  • کروم: ۱۳۳.
  • لبه: ۱۳۳.
  • فایرفاکس: ۱۴۲.
  • پیش‌نمایش فناوری سافاری: پشتیبانی می‌شود.

Source

LCP و INP اکنون پایه هستند. به تازگی در دسترس قرار گرفته است.

معیارهای بزرگترین رنگ‌آمیزی محتوا (LCP) و تعامل با رنگ‌آمیزی بعدی (INP) اکنون به صورت پایه‌ای (Baseline Newly) در دسترس هستند و سافاری ۲۶.۲ از API رنگ‌آمیزی محتوا و API زمان‌بندی رویداد (Event Timing API) که برای اندازه‌گیری این معیارها مورد نیاز است، پشتیبانی می‌کند.

این ویژگی‌ها در Interop 2025 گنجانده شده بودند و اکنون می‌توانید این معیارها را در آخرین نسخه همه مرورگرهای اصلی اندازه‌گیری کنید.

بزرگترین API رنگ‌آمیزی محتوا

Browser Support

  • کروم: ۷۷.
  • لبه: ۷۹.
  • فایرفاکس: ۱۲۲.
  • سافاری: پشتیبانی نمی‌شود.

Source

API زمان‌بندی رویداد

Browser Support

  • کروم: ۷۶.
  • لبه: ۷۹.
  • فایرفاکس: ۸۹.
  • سافاری: پشتیبانی نمی‌شود.

Source

CHIPS به خط تولید رسید. به تازگی در دسترس قرار گرفته است.

سافاری ۲۶.۲ همچنین شامل CHIPS (کوکی‌هایی با وضعیت پارتیشن‌بندی مستقل) است که به شما امکان می‌دهد یک کوکی را در فضای ذخیره‌سازی پارتیشن‌بندی‌شده انتخاب کنید، با یک کوکی جداگانه برای هر سایت سطح بالا.

Browser Support

  • کروم: ۱۱۴.
  • لبه: ۱۱۴.
  • فایرفاکس: ۱۴۱.
  • سافاری: پشتیبانی نمی‌شود.

Source

hidden="until-found"

سافاری ۲۶.۲ شامل پشتیبانی از hidden="until-found" است که اکنون به Baseline Newly تبدیل شده است.

Browser Support

  • کروم: ۱۰۲.
  • لبه: ۱۰۲.
  • فایرفاکس: ۱۳۹.
  • پیش‌نمایش فناوری سافاری: پشتیبانی می‌شود.

Source

ویژگی‌های command و commandfor

همچنین برای HTML در Safari 26.2 پشتیبانی از command و commandfor روی دکمه‌ها وجود دارد. این یک روش اعلانی برای کنترل پنجره‌های بازشو و دیالوگ‌ها فراهم می‌کند.

Browser Support

  • کروم: ۱۳۵.
  • لبه: ۱۳۵.
  • فایرفاکس: ۱۴۴.
  • پیش‌نمایش فناوری سافاری: پشتیبانی می‌شود.

Source

برای اطلاعات بیشتر به معرفی command و commandfor مراجعه کنید.

رویداد scrollend

یکی دیگر از ویژگی‌های جدید نسخه پایه سافاری ۲۶.۲، رویداد scrollend است. این رویداد هنگام تکمیل پیمایش اجرا می‌شود. برای اطلاعات بیشتر در مورد آن به Scrollend، یک رویداد جدید جاوا اسکریپت ، مراجعه کنید.

Browser Support

  • کروم: ۱۱۴.
  • لبه: ۱۱۴.
  • فایرفاکس: ۱۰۹.
  • پیش‌نمایش فناوری سافاری: پشتیبانی می‌شود.

Source

ویژگی scrollbar-color

ویژگی scrollbar-color به شما امکان می‌دهد رنگ نشانگر اسکرول بار و مسیر اسکرول بار را تغییر دهید. در سافاری ۲۶.۲، این ویژگی به صورت Baseline Newly نیز در دسترس قرار گرفته است.

Browser Support

  • کروم: ۱۲۱.
  • لبه: ۱۲۱.
  • فایرفاکس: ۶۴.
  • سافاری: پشتیبانی نمی‌شود.

Source

نسخه‌های بتای مرورگر منتشر شد

نسخه‌های بتای مرورگر، پیش‌نمایشی از چیزهایی که در نسخه پایدار بعدی مرورگر وجود خواهند داشت را به شما ارائه می‌دهند. اکنون زمان بسیار خوبی برای آزمایش ویژگی‌های جدید یا حذف مواردی است که می‌توانند قبل از انتشار عمومی، سایت شما را تحت تأثیر قرار دهند. نسخه‌های بتای جدید این ماه فایرفاکس ۱۴۷ و کروم ۱۴۴ هستند.

کروم ۱۴۴ شامل شبه عنصر ::search-text برای استایل‌دهی به نتایج جستجوی درون صفحه و پشتیبانی scrolled برای @scroll-state است که به شما امکان می‌دهد فرزندان کانتینرها را بر اساس آخرین جهت اسکرول استایل‌دهی کنید. همچنین شامل API Temporal، با اشیاء و توابع استاندارد برای کار با تاریخ و زمان است.

فایرفاکس ۱۴۷ یک نسخه هیجان‌انگیز است که شامل موقعیت‌یابی لنگر CSS، انواع انتقال نما و API ناوبری می‌شود.

برای اطلاعات بیشتر در مورد ویژگی‌های هیجان‌انگیز CSS و UI که امسال ارائه شدند، به CSS Wrapped 2025 مراجعه کنید.