跑步 ”
×
改变方向
在 Codepen 上打开
更改主题，深色/浅色
<!DOCTYPE html> <html> <head><meta http-equiv="content-security-policy" content="script-src 'none'"> <style> .div1 { float: left; width: 100px; height: 50px; margin: 10px; border: 3px solid #73AD21; } .div2 { border: 1px solid red; } .div3 { float: left; width: 100px; height: 50px; margin: 10px; border: 3px solid #73AD21; } .div4 { border: 1px solid red; clear: left; } </style> </head> <body> <h2>Без clear</h2> <div class="div1">div1</div> <div class="div2">div2 - Обратите внимание, что div2 стоит после div1 в HTML-коде. Однако, поскольку div1 перемещается влево, текст в div2 обтекает div1.</div> <br><br> <h2>Из clear</h2> <div class="div3">div3</div> <div class="div4">div4 - Здесь clear: left; перемещает div4 ниже плавающего div3. Значение "left" очищает элементы, перемещаемые влево. Вы также можете очистить "right" и "both".</div> </body> </html>
