CSS Dersleri

Explicit(belirlenmiş) ve implicit(belirlenmemiş) grid ögeleri

CSS Dersleri

Explicit(belirlenmiş) ve implicit(belirlenmemiş) grid ögeleri

1. CSS Grid'e (Izgara) Giriş 2. CSS Grid Özellikleri 3. fr birimi 4. CSS Izgara çizgi isimlendirmesi ve kullanımı 5. Sayfa planlama sihirbazı grid-template-areas CSS grid yazılarımızın 6. sında sizlere explicit (belirlenmiş), implicit(belirlenmemiş)  tanımlarını, grid-auto-columns, grid-template-rows ve grid-auto-flow  özelliklerini anlatacağım. display:grid tanımı yapılan kapsayıcı elemanın altındaki

By Fatih Hayrioğlu
Placeholder(yertutucu)'ları :placeholder-shown sözde sınıfı ile daha kullanışlı hale gitirmek

CSS Dersleri

Placeholder(yertutucu)'ları :placeholder-shown sözde sınıfı ile daha kullanışlı hale gitirmek

Kullanıcıdan bilgi aldığımız girdi alanlarının (input) kullanımını kolaylaştırmak ux (kullanıcı deneyimi) açısından önemli. Bunun için ilk olarak placeholder (yer tutucu)'ları HTML'e ekledik. Sonra bunları stilize ettik. Konuyla alakalı "CSS ile HTML5 Yer Tutucu’ya(placeholder) Stil Vermek" yazıma bakabilirsiniz. Daha sonra kullanıcının içeriği girdiğinde

By Fatih Hayrioğlu
CSS ipucu 34 - all unset ile tek satırda sıfırlama yapmak

CSS Dersleri

CSS ipucu 34 - all unset ile tek satırda sıfırlama yapmak

HTML elementlerinin farklı tarayıcı ve ortamlardaki davranışlarını ortak hale getirmek için genelde reset css kodları kullanırız. meyer, normalizer vs. Aslında bu listelerde yapılan belirtilen elemanların değerlerini bilinen ortak değer ataması yapmaktır. CSS all: unset tanımıyla birlikte bir seçicinin tüm değerlerinin tarayıcının belirlediği başlangıç değerine veya kalıtsal değerine döndürmek çok kolay.

By Fatih Hayrioğlu
Sayfa planlama sihirbazı grid-template-areas

CSS Dersleri

Sayfa planlama sihirbazı grid-template-areas

* CSS Grid'e (Izgara) Giriş * CSS Grid Özellikleri * fr birimi * CSS Izgara çizgi isimlendirmesi ve kullanımı CSS Grid yazılarımıza devam ediyoruz. Css grid özellikleri yazımızda grid ögelerini yerleştirmenin birkaç yöntemi var demiştik, grid-template-area özelliği bu yöntemlerden biridir. Bir önceki yazıda grid çizgi isimlendirmesi yardımıyla grid ögelerinin konumunu belirlemiştik. Bu

By Fatih Hayrioğlu