Css3 konumlandırma. Kesinlikle konumlandırılmış öğeler, float özelliğini yok sayar. css öğelerinin göreli konumlandırması

CSS ile ilgili en iyi şeylerden biri, stillerin bize içeriği ve öğeleri bir sayfada aklımıza gelebilecek her şekilde konumlandırma yeteneği vermesidir. Bu, tasarımımıza yapı kazandırır ve içeriğin daha görsel olmasına yardımcı olur.

CSS'de her biri kendi kapsamı olan birkaç farklı konumlandırma türü vardır. Bu bölümde, birkaç farklı kullanım örneğine - yeniden kullanılabilir düzenler oluşturma ve tek seferlik öğeleri benzersiz bir şekilde konumlandırma - göz atacağız ve bunun nasıl yapılacağına ilişkin birkaç yöntemi açıklayacağız.

Şamandıra konumlandırma

Öğeleri sayfada konumlandırmanın bir yolu, float özelliğidir. Bu özellik oldukça çok yönlüdür ve çeşitli şekillerde uygulanabilir.

Temel olarak, float özelliği bir öğeyi alır, onu sayfanın normal akışından çıkarır ve üst öğenin soluna veya sağına konumlandırır. Sayfadaki diğer tüm öğeler, böyle bir öğenin etrafına sarılır. Örneğin, öğe varsa paragraflar görüntünün etrafına sarılır. float özelliği ayarlanır.

Float özelliği aynı anda birden çok öğeye uygulandığında, çok sütunlu bir düzende gösterildiği gibi yüzer öğelerin yan yana veya karşılıklı olduğu bir düzen oluşturmayı mümkün kılar.

Float özelliği birkaç değer alır, en popüler ikisi sol ve sağ olup, bir öğenin üst öğesinin solunda veya sağında yüzmesine izin verir.

Img (kayan: sol;)

pratikte yüzer

Üstte başlık, ortada iki sütun ve altta bir alt bilgi bulunan genel bir sayfa düzeni oluşturalım. İdeal olarak, bu sayfa öğelerle işaretlenmelidir.