CSS2 kutu modeli bize adjoining vertical margins collapse olduğunu bildirir.CSS çöken marjlar amacı ne?
Birçok tasarım hatalarının kaynağı olarak oldukça can sıkıcıyım. Ben bunları kullanmak ve nasıl ihtiyaç değilken bunları önlemek için ne zaman çöken marjlar amacını anlayarak, anlıyorum umuyoruz.
Bu özelliğin amacı nedir?
"Kenar boşluğunun" genel anlamı, "bunu 10 pikselden fazla taşımalı" değil, "bu öğenin yanında 10 piksel boş alan olmalıdır."
Bunun her zaman paragraflarla kavramlaştırmanın en kolay olduğunu buldum.
margin-top: 10px numaralı paragrafları verdiyseniz ve başka öğeler üzerinde hiç kenar boşluğu yoksa, bir dizi paragraf güzel bir şekilde aralıklı olarak yerleştirilir. Ama tabi ki, bir paragrafın altına başka bir eleman yerleştirirken sorun yaşayacaksın. İkisi dokunurdu.
Kenar boşlukları daraltılmadıysa, önceki kodunuza margin-bottom: 10px eklemeyi tercih edersiniz, çünkü paragraflar diğer öğelerden yalnızca 10px ile ayrılırken, herhangi bir paragraf çifti 20px aralıklı olur.
Dikey kenar boşlukları daraltılır. 10px'in üst ve alt kenar boşluklarını ekleyerek, "diğer öğelerin sahip olduğu sınırların ne olduğu umrumda değil. Paragraflarımın her birinin üstünde ve altında en az 10px dolgu talep ediyorum."
Bunu hiç bilmiyordum, ama şimdi yaptığım için mutluyum! Çok ilginç. –
+1. Aynı mantık CSS dışında uygulanır. paragraf başlığı takip ederse, Microsoft Word Örneğin, paragraftan önce adından sonra ve 6px ait 12px bir marj var ise, 12px boşluk değil 18px olacaktır. –
sağ - onlar daraltmak - Aynı dom seviyesi değildir SÜRECE. Örneğin. çökermeyi deneyin [bu] (http://jsfiddle.net/gDuzC/2/) imho basitçe: gerçekten sinir bozucu IS – Toskan
bitişik ** dikey ** kenar boşlukları çöküş – sam