Float Kullanarak Bir Site ızgarası Nasıl Oluşturulur: Akıştan Düşme

Float Kullanarak Bir Site ızgarası Nasıl Oluşturulur: Akıştan Düşme
Float Kullanarak Bir Site ızgarası Nasıl Oluşturulur: Akıştan Düşme

Video: Float Kullanarak Bir Site ızgarası Nasıl Oluşturulur: Akıştan Düşme

Video: Float Kullanarak Bir Site ızgarası Nasıl Oluşturulur: Akıştan Düşme
Video: Akvaryum alt sump tanıtımı 2024, Mayıs
Anonim

Şamandıranın dezavantajlarına dikkat edelim. Blok ve satır içi öğelerin birbirleriyle nasıl davrandıkları ve bunların birlikte kullanılıp kullanılmayacakları. Kaybın ne olduğunu ve bununla nasıl başa çıkılacağını analiz edelim.

Float kullanarak bir site ızgarası nasıl oluşturulur: akıştan düşme
Float kullanarak bir site ızgarası nasıl oluşturulur: akıştan düşme

Son makalede, kayan noktalar kullanarak site için basit bir ızgara oluşturmamıza rağmen, aslında metindeki öğelerin akışını ayarlamaları amaçlanmıştır. Float'ın üç anlamı vardır: sol - öğeler sol kenar boşluğuna yapışır; sağ - elemanlar sağ kenara bastırılır; yok - Sarma modu devre dışı.

Float sarılı bir öğe boyutlandırılabilir ve dolgulu olabilir, ancak öğe satır içi ise bir blok öğesi gibi davranır.

. Blok 1 {

yüzer: sol;

genişlik: 150 piksel;

}

.block2 {

Sağa çık;

genişlik: 150 piksel;

}

Akıştan düşen şamandıraları kullanırken başka bir sorun var. Bloklar birbiri ardına gittiğinde ortaya çıkar, ancak bunlardan sadece biri float özelliğine sahipse, diğer blokları görmediği için diğerlerinin üzerinde olacaktır. Satır içi öğeler, kayan öğelerin etrafına sarılır, ancak bu metni içeren blok, kayan öğenin altında kalır.

resim
resim

Ancak şamandıra şamandıra ile nasıl etkileşime girer?

Metin gibi davranırlar: boş alan olduğu sürece birbiri ardına dururlar ve sonra yeni bir satıra geçerler. Bu nedenle, şamandıraların yardımıyla ızgaralar oluşturmaya başladık. Yer kalmadıysa, sitenin genişliğinin ötesine taşınırlar, yani hiçbir yere gitmezler.

Şamandıra basit blok elemanları görmüyorsa, blok elemanlarına şamandırayı görmeleri öğretilebilir. Her taraftan (veya seçili olanlardan) kaydırmayı devre dışı bırakan clear özelliğini kullanıyoruz. Yani clear olan bir element float olan elementin altına düşecektir.

Önerilen: