CSS Dünyasında Bu Hafta: @function, alpha(), CSS Wordle ve Dialog'da Yenilikler Windows

CSS Dünyasında Bu Hafta: @function, alpha(), CSS Wordle ve Dialog'da Yenilikler

CSS fonksiyonları, alpha() ile şeffaflık, Grid Lanes, dialog iyileştirmeleri ve CSS Wordle hakkında bu haftanın öne çıkan gelişmeleri.

CSS dünyası bu hafta oldukça hareketliydi. Jane Ori, @function'ın nasıl çalıştığını adım adım anlatan mükemmel bir rehber yayınladı. Bu özellik, bu yıl Baseline statüsüne geçmesi beklenen en büyük CSS yeniliklerinden biri. İlk başta göz korkutucu gelse de, Jane'in anlatımı sayesinde öğrenmesi oldukça kolaylaşıyor. Ayrıca Declan Chidlow tarafından hazırlanan @function dokümantasyonu da hızlı başvuru için yer imlerine eklenmeyi hak ediyor.

Fonksiyonlar demişken, alpha() fonksiyonu beni oldukça şaşırttı. İlk duyduğumda 'neden böyle bir fonksiyona ihtiyaç var?' diye düşündüm. Sonuçta alpha kanalını zaten değiştirebiliyoruz. Ancak Jason Leo'nun yorumu her şeyi açıklıyor: alpha() sayesinde CSS değişkenlerinde renk değerlerini sabit kodlamak zorunda kalmıyoruz. Yıllardır CSS değişkenlerinde sadece değerleri saklayarak bu sorunu aşmaya çalışıyordum, ancak her seferinde color fonksiyonuna sarmak gerçekten monotonlaşıyordu. alpha() ise hem değişkenlerle esnek kullanım sağlıyor hem de renk formatından bağımsız olarak amacı daha net ifade ediyor.

WebKit, Grid Lanes (eski adıyla CSS masonry layout) için kapsamlı bir rehber yayınladı. 'Field Guide to Grid Lanes' adlı bu rehber, CSS-Tricks rehberlerine benzer bir yapıda. Temel kavramlardan gerçek dünya örneklerine kadar her şeyi sade bir şekilde açıklıyor. Özellikle duvar örgüsü (masonry) düzenine ilgi duyanlar için kaçırılmayacak bir kaynak.

Gelecekte Ne Bekleniyor?

Una Kravets,

elementi için iki önemli kalite iyileştirmesinden bahsetti: closedby özelliği ve overscroll-behavior: contain. closedby henüz Safari tarafından desteklenmiyor, ancak 'any' değeri ile diyalogun dışına tıklandığında kapanmasını sağlıyor. overscroll-behavior: contain ise kaydırma taşmasını engelliyor. Yorumlarda scrollbar-gutter: stable ile ilgili bir ipucu da mevcut. Ayrıca Chris Coyier, animasyonlarını nasıl yapacağımızı gösterdi; @starting-style ile uğraşmak her seferinde Google'da arama yapmayı gerektirse de, işe yarıyor.

CSS Day 2026, 11-12 Haziran'da Amsterdam'da gerçekleşti. Canlı yayın olmasa da kayıtlar Haziran sonunda yayınlanacak. Etkinlikte neler olduğunu öğrenmek için Bluesky'daki #CSSDay etiketini takip edebilirsiniz. Bu yıl alev makineleri yoktu ama DOOM'suz da değildi (bilen bilir).

Yoğun bir haftanın ardından biraz eğlenmek isteyenler için Sunkanmi Fafowora'nın CSS Wordle oyunu harika bir seçenek. Geçen haftadır bu oyuna takıntılı olduğumu itiraf etmeliyim. CSS bilginizi test ederken eğlenceli vakit geçirmenizi sağlıyor. Bir sonraki sayıda görüşmek üzere!

Kaynak: css-tricks.com

Paylaş: