Copper Sticky Header
The header stays pinned with position sticky while the body scrolls underneath.
The first column stays pinned while the remaining columns scroll sideways under it.
Canlı önizleme herkese açıktır. Kod sekmeleri, kopyalama, kaynak API'si ve izole önizleme belgesi üyelik gerektirir.
HTML, CSS, React çıktısı, kopyalama ve tarayıcı editörü giriş yaptıktan sonra açılır.
Bu efektte bir sorun mu var, yoksa daha iyisini mi yazdın? Düzeltme gönder — onaylanırsa puan kazanırsın.
Sorun bildir veya düzeltBu efektte kullanılan CSS teknikleri — her biri canlı örnekli bir rehbere ya da özelliğin referans sayfasına bağlanır.
<style> etiketine ekle.Tablolar kategorisindeki tüm efektler gibi bu efekt de tamamen ücretsizdir; ticari projelerde de kullanabilirsin. Kütüphanenin tamamı için Tablolar koleksiyonuna göz at.
The header stays pinned with position sticky while the body scrolls underneath.
Pointing at any cell lights the whole column through a pure CSS has() selector.
Shading runs vertically instead of horizontally so every other column is tinted.
Accounting alignment pins the currency sign left while the figures stay flush right.
Each nutrient draws a hairline whisker ending in a soft breathing dot instead of a filled bar.
The shift that is live right now carries a blinking beacon while the queue behind it stays dim.
Line items sit above a footer block that separates the subtotal from the total due.
The table collapses into compact cards where each cell prints its own label on the left.