float 浮動 文件流和文字流區別

2022-09-17 21:24:21 字數 604 閱讀 6592

關於float屬性的脫離文件流的問題

在使用float浮動後,元素雖然會脫離文件流,但還處在文字流的位置當中

下面我自己試了一下,給a,b兩個元素分別設定了樣式,而只給第乙個a設定了float浮動屬性,然而效果顯示,a覆蓋了b,出現了重疊效果

如果在b內寫入文字,就又能顯示出來了:

脫離文件流:也就是將元素從普通的布局排版中拿走,其他盒子在定位的時候,會當做float元素不存在而進行定位。

float只是脫離了文件流的dom空間但是還佔據著文字空間.使用float脫離文件流時,其他盒子會無視這個元素,但其他盒子內的文字依然會為這個元素讓出位置

文件流和文字流的區別

1.文件流是指html文件載入解析時從上到下,從左向右,但相對於盒子模型來說,浮動後脫離文件流,但是沒有脫離文字流。1.1 doctype html html head meta charset utf 8 title document title style test01 style head b...

HTML 標準文件流(float的浮動屬性)

html元素在標準狀況下的定位方式 行內元素在同一行內橫向排列 塊級元素佔滿整個一行,在頁面中豎向排列 元素不會移動到其它地方去,對於巢狀的元素盒子也是巢狀的 元素的浮動是指設定了浮動屬性的元素會脫離標準文件流的控制,移動到其父元素中相應位置的過程。在css中,通過float屬性來定義浮動,其基本語...

標準文件流 浮動

定義 內容從左到右,從上到下書寫的。前面的內容大小或者位置發生變化時,後面的內容位置也會隨之變化。web頁面,就是乙個標準的文件流。內容跟咱們的書寫順序有關。1 空白摺疊現象 無論多少個空格,tab,換行都會摺疊為乙個空格。張老師 真帥 2 高矮不同,底部對齊 妖怪我要你助我修行 3 一行寫滿,自動...