CSS Dersleri2 dk okuma
CSS Flexbox: Order Nedir?
Flexbox, web sayfalarında öğeleri esnek ve düzenli bir şekilde hizalamamızı sağlar. Flexbox’ın sunduğu en ilginç özelliklerden biri de order özelliğidir. Peki order tam olarak ne işe yarar?
Yazıyı okuBilGen Blog
CSS Dersleri
Yazılım geliştirme, JavaScript, web teknolojileri ve programlama üzerine adım adım rehberler, kod örnekleri ve teknik yazılar.
42 yazı · Sayfa 1 / 3
CSS Dersleri4 dk okuma
CSS'te Medya Sorguları (Media Queries) ile Responsive Tasarım
Günümüzde web siteleri farklı ekran boyutlarına uyum sağlamalıdır. Bir web sitesinin hem masaüstü bilgisayarlarda hem de mobil cihazlarda düzgün görünmesini sağlamak için responsive (duyarlı) tasarım kullanılır. Responsive tasarımın en önemli araçlarından bir
Yazıyı oku
CSS Dersleri3 dk okuma
CSS Flexbox: flex-basis, flex-grow ve flex-shrink Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğelerin nasıl büyüyüp küçüleceğini belirlemek için güçlü özellikler sunar. flex-basis, flex-grow ve flex-shrink özellikleri, öğelerin ana eksen (main axis) boyunca nasıl boyut
Yazıyı oku
CSS Dersleri3 dk okuma
CSS Flexbox: align-content ve align-self Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğeleri düzenlemek ve hizalamak için oldukça kullanışlıdır. align-content ve align-self özellikleri, öğelerin çapraz eksen (cross axis) boyunca nasıl hizalanacağını belirler. B
Yazıyı oku
CSS Dersleri3 dk okuma
CSS Flexbox: align-items Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğeleri düzenlemek ve hizalamak için oldukça kullanışlıdır. align-items özelliği, öğelerin çapraz eksen (cross axis) boyunca nasıl hizalanacağını belirler. Bu yazıda, <
Yazıyı oku
CSS Dersleri3 dk okuma
CSS Flexbox: flex-wrap Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğeleri düzenlemek ve hizalamak için oldukça kullanışlıdır. flex-wrap özelliği, öğelerin ana eksen boyunca tek bir satırda mı yoksa birden fazla satır veya sütunda mı yer alacağını</STR
Yazıyı oku
CSS Dersleri3 dk okuma
CSS Flexbox: justify-content Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğeleri düzenlemek ve hizalamak için oldukça kullanışlıdır. justify-content özelliği, içeriklerin ana eksen (main axis) boyunca nasıl hizalanacağını belirler. Bu yazıda, <STRON
Yazıyı oku
CSS Dersleri2 dk okuma
CSS Flexbox: flex-direction Nedir?
Web geliştirmeye yeni başlayanlar için Flexbox, öğeleri düzenlemek ve hizalamak için oldukça kullanışlıdır. flex-direction özelliği, öğelerin hangi yönde hizalanacağını belirleyen en önemli özelliklerden biridir. Bu yazıda, flex-direction
Yazıyı oku
CSS Dersleri4 dk okuma
CSS Flexbox: Esnek ve Güçlü Bir Düzenleme Aracı
Web geliştirme sürecinde en sık karşılaşılan problemlerden biri, sayfadaki içeriklerin düzenli ve uyumlu bir şekilde yerleştirilmesidir. Bir web sitesinde menü çubuğunun düzgün hizalanması, kartların belirli bir düzene göre sıralanması veya bir giriş formundaki alanların orantılı şekilde yerle
Yazıyı oku
CSS Dersleri4 dk okuma
CSS'te Google Fonts Kullanımı
Web sitelerinde kullanılan yazı tipleri, tasarımın genel estetiğini ve okunabilirliğini doğrudan etkileyen önemli bir faktördür. Ancak, her kullanıcının bilgisayarında aynı yazı tiplerinin yüklü olması garanti edilemez. Bu nedenle, Google Fonts gibi çevrimiçi
Yazıyı oku
CSS Dersleri4 dk okuma
CSS Transform Nedir?
CSS’in en güçlü özelliklerinden biri olan transform, web sayfalarındaki öğeleri döndürmemizi (rotate), ölçeklendirmemizi (scale), kaydırmamızı (translate)
Yazıyı oku
CSS Dersleri4 dk okuma
CSS Transitions Nedir?
Web sitelerinde öğelerin aniden değişmesi yerine, daha akıcı ve göze hoş gelen geçişler yapmasını sağlayan CSS Transitions (Geçişler) özelliği, modern web tasarımında oldukça yaygın olarak kullanılır. Bu özellik, bir CSS özelliğinin bir değerden başka bir değ
Yazıyı oku
CSS Dersleri4 dk okuma
CSS’te Position ve z-index Kullanımı
CSS’te konumlandırma (position) özelliği, HTML öğelerinin sayfadaki yerleşimini belirlemek için kullanılır. Ancak, bu özellik yeni başlayanlar için biraz kafa karıştırıcı olabilir. Çünkü static, relative, absolute, fixed ve sticky</S
Yazıyı oku
CSS Dersleri3 dk okuma
CSS’te Opacity ve Alpha Channel Kullanımı
Web geliştirme sürecinde, sayfa tasarımında renklerin şeffaflığına ihtiyacımız olabilir. Bu noktada opacity (opaklık) ve alpha channel (alfa kanalı) kavramları devreye girer. Her ikisi de bir öğenin veya rengin ne kadar şeff
Yazıyı oku
CSS Dersleri4 dk okuma
CSS Box-Sizing ile Kutu Yönetimi
Web geliştirme sürecinde, sayfadaki kutuların (div, buton, input vb.) genişliğini ve yüksekliğini doğru şekilde ayarlamak bazen kafa karıştırıcı olabilir. Box-sizing, CSS’te kutuların padding (iç boşluk) ve border (kenarlık) dahil toplam geni
Yazıyı oku
CSS Dersleri4 dk okuma
CSS’de REM Birimi Nedir?
CSS’de boyutları belirlemek için kullanılan en önemli göreceli (relative) birimlerden biri de REM (root em) birimidir. REM, EM birimine benzese de, bazı önemli farklara sahiptir. <s
Yazıyı oku
CSS Dersleri4 dk okuma
CSS’de EM Birimi Nedir?
CSS’de öğelerin boyutlarını belirlemek için göreceli (relative) ve mutlak (absolute) birimler kullanılır. Göreceli birimler, bir öğenin boyutunu başka bir öğeye veya kendi özelliklerine bağlı olarak ayarlamamıza olanak tanır. Bu yazıda, <
Yazıyı oku
CSS Dersleri4 dk okuma
CSS Birimleri Kullanımı ve Özellikleri
CSS’de öğelerin genişlik, yükseklik, yazı tipi boyutu gibi değerlerini belirlemek için birimler (units) kullanılır. Piksel (px), yüzde (%), em ve
Yazıyı oku