Mart ayında web platformunda yeni kullanıma sunulanlar

Mart 2022'de kararlı ve beta web tarayıcılarına eklenen ilginç özelliklerden bazılarını keşfedin.

Rachel Andrew

Kararlı tarayıcı sürümleri

Mart ayında Chrome 99, Chrome 100, Firefox 98 ve Safari 15.4 kararlı sürüm olarak kullanıma sunuldu. Bu sayede platforma bir dizi yeni özellik eklendi. Bu eklemelerin çoğu, özelliğin üç tarayıcı motorunda da kullanıma sunulması anlamına geliyordu. Bu yayında, tarayıcılar arası birlikte çalışabilirlik sağlayan eklemelere odaklandım. Ancak her motora eklenen tüm özellikleri görmek için sürüm notlarına göz atın.

Chrome 99 ve Safari 15.4, Cascade Layers'ı içeriyordu. @layer at-kuralı, belirliliği kontrol etmenize yardımcı olan bir basamaklı katman tanımlar. Bu tarayıcılar Firefox'a katıldığından, Cascade Layers artık üç tarayıcı motorunun hepsinde kullanılabilir. Basamaklı katmanlar tarayıcınıza ekleniyor bölümünde Katmanları Basamakla hakkında daha fazla bilgi edinebilirsiniz.

Tarayıcı Desteği

  • Chrome: 99.
  • Kenar: 99.
  • Firefox: 97.
  • Safari: 15.4

Kaynak

Chrome 100, CSS mix-blend-mode mülkü için plus-lighter değerini içerir. Bu değer, tüm pikseller veya bir alt kümesi aynı değerlere sahip olduğunda iki öğenin çapraz şekilde soldurulmasında yararlıdır. Bu çözümün çözdüğü sorun hakkında daha fazla bilgiyi İki DOM öğesinin geçişli şekilde örtüşmesi şu anda mümkün değildir başlıklı makalede bulabilirsiniz.

Tarayıcı desteği

  • Chrome: 100.
  • Edge: 100.
  • Firefox: 99.
  • Safari: 9.1.

Safari 15.4, CSS'nin dahil edilmesine olanak tanıyan contain özelliğini içerir.

Tarayıcı desteği

  • Chrome: 52.
  • Edge: 79.
  • Firefox: 69.
  • Safari: 15.4.

Kaynak

Safari 15.4'te ayrıca, bazı form kontrollerinde kullanılan vurgu rengini kontrol etme olanağı sunan accent-color de bulunur.

Tarayıcı desteği

  • Chrome: 93.
  • Edge: 93.
  • Firefox: 92.
  • Safari: 15.4.

Kaynak

Firefox 98 ve Safari 15.4, iletişim kutusunu temsil eden <dialog> öğesini kullanıma sundu.

Tarayıcı desteği

  • Chrome: 37.
  • Edge: 79.
  • Firefox: 98.
  • Safari: 15.4.

Kaynak

Safari 15.4, gerçek :focus-visible sınıfı desteğini de tamamladı. Bu konudaki uygulama çalışmaları Igalia tarafından yapılmıştır.

Tarayıcı Desteği

  • Chrome: 86.
  • Edge: 86.
  • Firefox: 85.
  • Safari: 15.4.

Kaynak

Beta tarayıcı sürümleri

Beta tarayıcı sürümleri, tarayıcının bir sonraki kararlı sürümünde yer alacak özelliklerin önizlemesini sunar. Bu sürüm dünya genelinde kullanıma sunulmadan önce sitenizi etkileyebilecek yeni özellikleri veya kaldırma işlemlerini test etmek için mükemmel bir zamandır.

Mart ayında Chrome 101 ve Firefox 99 yeni beta sürümleriydi.

Chrome 101 beta hwb renk gösterimini içerir. Bu renk tonuna, beyazlığına ve siyahlığına göre rengi belirtir. Diğer renk gösterimlerinde olduğu gibi, isteğe bağlı bir alfa bileşeni opaklığı belirtir.

h1 {
  color: hwb(194 0% 0% / .5) /* #00c3ff with 50% opacity */
}

Tarayıcı desteği

  • Chrome: 101.
  • Kenar: 101.
  • Firefox: 96.
  • Safari: 15.

Kaynak

Firefox 99, Navigator arayüzünün pdfViewerEnabled mülkünü içerir. Bu özellik, tarayıcının PDF dosyalarının satır içi görüntülenmesini destekleyip desteklemediğini belirtir.

if (!navigator.pdfViewerEnabled) {
  // The browser does not support inline viewing of PDF files.
}

Tarayıcı desteği

  • Chrome: 94.
  • Edge: 94.
  • Firefox: 99.
  • Safari: 16.4.

Kaynak

Bu beta özellikler yakında kararlı tarayıcılarda kullanıma sunulacaktır.

Web'de yeni olanlar serisi kapsamında