CSS Kaydırma (CSS Float)

Float, Css ile web sayfası tasarımı yaparken en çok kullanılan değerlerin başında gelir. Elementi akışın dışına çıkarmak için kullanılan yöntemdir. Bu özellikler ile nesnelerin pozisyonları belirlenir. Yukarıdaki örnekte tanımladığım “float” içine “right” değerini verdim. “float” değerini atamamış olsaydık tarayıcıda çalıştırdığımızda resim sol tarafta görünecekti. Ancak “right” konumlandırmasını yaptığımızdan sağ tarafta görüntülenecek. Ayrıca float içerisinde left,right,inherit…

Okumaya devam et

CSS Kutu Modeli (CSS Box Model)

Merhaba şimdi sıra geldi CSS Kutu Modeli Nedir? (CSS Box Model Nedir?) sorumuzu cevaplandırmaya 😀 CSS’de her bir öğe bir kutu oluşturur. Eğer konu CSS’de tasarım ve düzense “Kutu Modeli” terimi kullanılır. CSS Kutu Modeli HTML bileşenlerini saran margin (kenar mesafesi), border (sınır) ,padding (boşluk) ve content (içerik) elemanlarından oluşur. Kutu Modeli, elemanların etrafına sınır (border) eklememize ve elemanlar…

Okumaya devam et

CSS Kalıtım (Inheritance)

CSS ve HTML kodları ile çalışırken tüm elementlere tek tek stil atamak yorar ve zaman kaybına neden olur. Bu uzun yolu tercih etmemek ve gereksiz kodlardan uzaklaşmak için elementlere atayacağımız değerin tüm child elementlere uygulanmasını sağlayacağız. İşte bu özelliğe katılım adı veriliyor. Tıpkı anne ve babanın özelliklerinin çocuklara geçmesi gibi bir parent (ebeveyn)’a atanan stil…

Okumaya devam et

CSS Important Özelliği

Bir stil üzerinde yaptığınız değişiklikle uygulanmadığında bu stil değerlerini işaretleyebilirsiniz. İşaretlediğinizde yaptığınız değişiklik gerçekleşmiş olacaktır. Yukarıdaki örnekte “style” içerisinde tanımladığım important etiketi ne olursa olsun aynı öğeye etki eden diğer stilleri ezer ve önüne geçer. Diğer tanımlamalar iptal edilir ve bu değişiklik uygulanmış olur. important’ı öğrendik diğer CSS derslerinde görüşmek üzere 😀

Okumaya devam et

İç İçe Element Kullanımı

Html’in bazı elementleri kendi içerisinde diğer elementleri ve öğeleri barındırabilir. Tanımlanan bu elementler hiyerarşik yapıdadır. Kısacası “ebeveyn-çocuk” ilişkisi söz konudur. Örneğin; Yukarıda yer alan örnekte “Ornek1” elementinin içerisinde “Ornek2” elementinin yer aldığını görüyoruz. Bu durumda “Ornek2” elementi “Ornek1” elementinin çocuk (child) elementi oluyor.  

Okumaya devam et

CSS Class Kullanımı

Class seçicisi tıpkı ID seçicisi gibi etikete ulaşmamızı sağlayan bir yoldur. Fakat ID alanı gibi benzersiz bir tanımlamaya sahip olmak zorunda değildir. Örneğin bir div sayfası içerisinde birde fazla html elementi olabilir. Bu html elementleri div içerisinde olacağı gibi dışında da yer alabilir. Bu gibi durumlarda class özelliği bize kolaylık sağlıyor. Nasıl mı? Hemen inceleyelim. ID…

Okumaya devam et

CSS ID Kullanımı

ID, tek bir element için kullanılan tanımlamaya verilen isimdir. Verilen ID değeri tek ve benzersiz olmalıdır. Tek bir elemente tanımlandığı için class gibi birden fazla elementte kullanılamaz. Örnek verecek olursak; İlgili div’e bir ID tanımladık. Artık div’in ID değeri merhaba’dır. *ID değerleri rakamla başlamaz harfle başlamak zorundadır. Şimdi yukarıdaki tanımlamamız için örnek bir css yazalım….

Okumaya devam et