Почему float следует четким

Question

Что значит плавать влево, а затем очищать влево. Или поплыть влево, затем ясно? Может ли кто-нибудь помочь мне понять это. Я не парень CSS, но мне нужно понять некоторые из CSS, с которыми я работаю.

#elem1{ 
    float:left; 
    clear:left; 
} 

#elem2{ 
    float:left; 
    clear:right; 
} 

Answer 1

Если вы плаваете два элемента вместе, они будут выровняться по одной и той же горизонтальной оси, если вы не применяете очистку.

Сканируя плавающий элемент, чтобы очистить, он очищает любые поплавки, которые приходят до, а затем плавает везде, где проектировщик намерен его плавать. Он будет идти по новой линии или нет, в зависимости от направления прозрачности.

Посмотрите это jsFiddle example для визуализации. Первые два <div> s ничего не очищают, в то время как последние два <div> s установлены для очистки левого и правого поплавков.

Answer 2

clear предназначено для размещения элемента ниже любых предыдущих плавающих элементов, чтобы «очистить линию».

Обычно плавающие элементы накапливаются на той же линии, как это:

--- --- --- 
| | | | | | 
--- --- --- 

внесении их ясно все предыдущие плавучие элементы сделают их организовать так:

--- 
| | 
--- 
--- 
| | 
--- 
--- 
| | 
--- 

Answer 3

Вот более четкое представление почему нужен ясный. http://www.quirksmode.org/css/clearing.html