css 中的 clear 屬性用于控制浮動元素周圍的區(qū)域,規(guī)定后續(xù)元素的定位方式,有三個值:left、right、both,用于分別從浮動元素的左側(cè)、右側(cè)或左右兩側(cè)開始后續(xù)元素的定位。
CSS 中的 clear
clear 是什么意思?
clear 屬性用于控制浮動元素周圍的區(qū)域。它規(guī)定當(dāng)遇到浮動元素時,后續(xù)元素的定位方式。
詳細(xì)解釋:
浮動元素會脫離正常文檔流,沿著其父元素的邊緣排列。clear 屬性允許后續(xù)元素跳過浮動元素,而不是環(huán)繞它們。
有三種 clear 值:
left:元素從浮動元素的左側(cè)開始
right:元素從浮動元素的右側(cè)開始
both:元素從浮動元素的左右兩側(cè)開始
使用示例:
<code class="<a style='color:#f60; text-decoration:underline;' href=" https: target="_blank">css"><div class="container"> <div class="float-left">浮動元素</div> <div class="clear"></div> <div>后續(xù)元素</div> </div></code>
登錄后復(fù)制
在上面的示例中,.clear 類應(yīng)用了 clear: both; 屬性。這將導(dǎo)致后續(xù)元素從浮動元素的左右兩側(cè)開始,從而創(chuàng)建了一個間隙,使后續(xù)元素不會被浮動元素包裹。