جدید در کروم ۱۴۲

راشل اندرو

منتشر شده: ۲۸ اکتبر ۲۰۲۵

کروم ۱۴۲ اکنون در حال انتشار است و این پست برخی از ویژگی‌های کلیدی این نسخه را به اشتراک می‌گذارد. یادداشت‌های کامل انتشار کروم ۱۴۲ را بخوانید.

نکات برجسته این نسخه:

شبه کلاس‌های :target-before و :target-after

این شبه‌کلاس‌ها نشانگرهای پیمایشی را که قبل یا بعد از نشانگر فعال (مطابق با :target-current ) در همان گروه نشانگر پیمایش قرار دارند، مطابق با ترتیب درخت مسطح، تطبیق می‌دهند:

  • :target-before : با تمام نشانگرهای پیمایش که قبل از نشانگر فعال در ترتیب درخت مسطح درون گروه قرار دارند، مطابقت دارد.
  • :target-after : با تمام نشانگرهای پیمایش که نشانگر فعال را در ترتیب درخت مسطح درون گروه دنبال می‌کنند، مطابقت دارد.

سینتکس محدوده برای کوئری‌های مربوط به کانتینر استایل و if()

کروم با افزودن پشتیبانی از سینتکس محدوده، کوئری‌های سبک CSS و تابع if() را بهبود می‌بخشد.

این قابلیت، کوئری‌های استایل را فراتر از تطبیق دقیق مقدار (برای مثال، style(--theme: dark) ) گسترش می‌دهد. توسعه‌دهندگان می‌توانند از عملگرهای مقایسه‌ای (مانند > و < ) برای مقایسه ویژگی‌های سفارشی، مقادیر تحت‌اللفظی (برای مثال، 10px یا 25%) و مقادیر توابع جایگزینی مانند attr() و env() استفاده کنند. برای یک مقایسه معتبر، هر دو طرف باید به یک نوع داده مشابه برسند. این قابلیت به انواع عددی زیر محدود می‌شود: <length> ، <number> ، <percentage> ، <angle> ، <time> ، <frequency> و <resolution> .

مثال‌ها:

یک ویژگی سفارشی را با طول تحت‌اللفظی مقایسه کنید:

@container style(--inner-padding > 1em) {
  .card {
    border: 2px solid;
  }
}

مقایسه دو مقدار تحت‌اللفظی

@container style(1em < 20px) {
  /* ... */
}

استفاده از محدوده‌های استایل در if() :

.item-grid {
  background-color: if(style(attr(data-columns, type<number>) > 2): lightblue; else: white);
}

فراخوانی‌کننده‌های Interest (ویژگی interestfor )

کروم یک ویژگی interestfor به عناصر <button> و <a> اضافه می‌کند. این ویژگی رفتارهای "علاقه" را به عنصر اضافه می‌کند. وقتی کاربر به عنصر علاقه نشان می‌دهد ، اقداماتی روی عنصر هدف انجام می‌شود، به عنوان مثال، نمایش یک popover.

عامل کاربر از طریق روش‌هایی مانند نگه داشتن اشاره‌گر روی عنصر، فشردن کلیدهای میانبر ویژه روی صفحه کلید یا فشار دادن طولانی مدت عنصر در صفحه‌های لمسی، تشخیص می‌دهد که چه زمانی کاربر به عنصر علاقه نشان می‌دهد. هنگامی که علاقه نشان داده می‌شود یا از بین می‌رود، یک InterestEvent روی هدف اجرا می‌شود که دارای اقدامات پیش‌فرض برای نمایش‌های پاپ‌اوور، مانند نمایش و پنهان کردن پاپ‌اوور است.

مطالعه بیشتر

این فقط برخی از نکات برجسته کلیدی را پوشش می‌دهد. برای تغییرات بیشتر در کروم ۱۴۱، لینک‌های زیر را بررسی کنید.

اشتراک

برای به‌روز ماندن، در کانال یوتیوب توسعه‌دهندگان کروم مشترک شوید و هر زمان که ویدیوی جدیدی منتشر کنیم، یک اعلان ایمیلی دریافت خواهید کرد. یا برای مقالات و پست‌های وبلاگ جدید، ما را در X یا لینکدین دنبال کنید.

به محض انتشار کروم ۱۴۳، ما همینجا هستیم تا به شما بگوییم چه چیزهایی در کروم جدید است!