Merhaba. Öncelikle başlığı neden bu şekilde yazdın diye soracak olursanız, yalnızca “CSS hakkında sorular” yazmak yerine, yardıma ihtiyacı olabilecek diğer arkadaşlar için detaylı bir başlık yazmak istedim. İnternet üzerinden çalışıyorum ancak kafama takılan soruları buraya sorarak, bu işi bilenlerden de destek almak istedim.
Soru 1 :
CSS’de temel mantık, yazılan kodların alt alta okunmasıdır. Position sayesinde bunları bir yere konumlandırıyor ve sağa sola hareket ettiriyoruz diyebilir miyiz? Eğer öyleyse, float yalnızca yan yana koymak için mi kullanılıyor?
Soru 2:
Div etiketi ne için kullanılır? Mesela kafama takıldığı için aşağıdaki kodları sormak istiyorum:
Şimdi buradaki kullanım yanlış mıdır? Yoksa logo ve bannerı div içine almam mı gerekirdi? Bu şekilde temel etiketler de block mantığında olduğu için, id yazarak düzenleme yapmak saçma mı olur?
Son olarak 3.soru:
CSSde anlatılan class konusu, tıpkı programlamadaki nesne tabanlı programlama mantığında mıdır? Yani, belirli özelliklere sahip bir class oluşturuyoruz ve bunları HTML kodlarına entegre ediyoruz. HTML kodu o yazdığımız ortak özelliklerin mensubu, bir nevi sınıfın bir parçası mı olmuş oluyor?
Hiyerarsik veya OOP’deki gibi birbirinden tureyen nesneler demeyi tercih ederim.
Bunlar elemanin pozisyonunun yaninda dizilim kurallarini (yani diger elemanlari) da etkileyen ozellikler, tam olarak ne yaptiklarini anlamak icin bir referansa bakmakla beraber kisaca ozetlemesi icin deneyimli birine sorabilirsin.
Elemanlari gruplamak icin. Tek basina hic bir ozelligi yokmus.
Dogru, fakat terih edilmeyen bir stil olabilir. Yine, stil kismini, isi front-end olan birinin yorumlamasi daha dogru olacaktir. div’e gerek yok cunku ikisine birden bir sey yapmak istemiyorsun, istesen bile header var zaten.
Hayir, sadece isim benzerligi.
Illa programlamayla bir paralel cekmek istiyorsak, en cok trait’lere benziyor.
Elemanlari yazmak istedigimiz kurallara gore klasifiye ediyor (siniflandiriyor), sonra bu siniflara gore kural yaziyoruz. “Erkekler pantolon giysin”, “gozu bozuklar on siraya otursun”, “ucuncu siniflar yan binaya gitsin”.
Nesne tabanli programlamadaki siniflar daha hiyerarsik, aslinda CSS’teki kural bloklarina benziyorlar. Bir sinifa birden fazla ozellik/kural vermek icin birden fazla siniftan turetmek (multiple inheritance) mumkun, fakat 1) cogunlukla iyi bir fikir degil, composition tercih ediliyor ve 2) bu, korkulan ve populer dillerde olmadigi zannedilen bir sey.
Sadece şunu söylemek istiyorum. Float’ın gerçekten nasıl çalıştığını tam olarak bilmiyorum. Evet bir elementin sağa sola yüzdürülmesini sağlıyor. Benim favorim flexbox. Kullanışlı, anlaşılabilir, donanımlı…
Div elemanları gruplamak için kullanılır. Kendi başına özelliği blok element olması.
Class denilen yapı, örnek veriyorum Python dilindeki sınıflara benzer ancak aynı şey değildir. CSS’de her sınıfın belli özellikleri vardır ve o sınıfa dahil olan elementler o özellikleri alır.
@aib zahmet verip, detaylarıyla açıkladığınız için çok teşekkürler.
@PRIME doğrusu flexbox özelliğini bilmiyordum hocam. Araştıracağım inşaallah.
O halde şunu sormak istiyorum, dediğiniz gibi float nesnelerin yan yana gelmesini sağlayan bir özellik, sanıyorum doğru anladım. Pekala position ile neredeyse tüm nesneleri konumlandırıyoruz ve sadece yan yana gelmesini istediğimiz nesneleri float ile düzenliyoruz diyebilir miyiz?
Yani ben css üzerine çalışırken, hazırladığım her bloğu diyeyim, position ile konumlandırmak zorundayım değil mi?
Evet, float nesneleri yan yana getiriyor. float kullandığın nesneler sonrası bir temizleme yaptırman gerekiyor clear koduyla. En kolay yolu float yapılan en son divden sonra bir div daha koyarak div’in css koduna clear:both yapman gerekir.
Aksi halde sitede kayma olur.
Ancak artık float yerine flexbox kullanılıyor genelde.
Herhangi bir nesneyi belli bir noktaya konumlandırmak istediğin zaman position kullanılır. Sürekli kullanmak zorunda değilsin.
Divlerin varsayılan position kodu relative’dir. Konumlandırmak istediğin zaman position:absolute; yapman gerekiyor. Bu koddan sonra div yüzer konuma gelir ve konumlandırmak için top, left, right, bottom değerleri vermen lazım. Örneğin sol üst köşeye yerleştirmek istersen top:0; left:0; demen gerekiyor.
Aşağıdaki linkten CSS ve HTML öğrenebilirsin. Youtube’da birçok ders var. CSS Dersleri HTML Dersleri
Hocam, açıklamalar için çok teşekkürler. Ama kafama takıldığı için soracağım: divlerin varsayılan position kodu static değil midir? Relative ise, kendinden bir önceki divin konumuna göre şekil almasını sağlamak için kullanılmıyor mu?
Tekrar merhaba.
Evet haklısın. Ben yanıtlarken karıştırmışım. Varsayılan konum static’tir.
Relative ise söyle anlatayım.
Bir genel adında div var.
Onun içinde de icerik diye bir div var.
İcerik divini position etmek istiyorsunuz ancak genel divinin dışarısına da çıkmasın istiyorsunuz. icerik divine position dediğiniz anda o div ekranın en sol en üstüne kayacaktır. Genel divin içerisinde kalmasını sağlamak için genel div’e position:relative vermeniz gerekmektedir. Bu şekilde yaptığınızda position div’i genel divinin en üst ve en soluna gelecektir.
