overflow屬性清除浮動,bfc優缺點?
1.bfc全稱Block formatting context,塊級格式化上下文,字面理解就是一個獨立渲染的區域,里面的內容不受外界的影響。
2.一般設置了浮動,絕對定位/固定定位、dispaly的值為inline-block、table-cell、flex…或者元素設置了overflow的值除visible的情況下會產生。
3.一般用于清除浮動、設置左邊固定大小,右邊自適應布局,margin之間的層疊問題。
4.缺點的話因為我沒有找到其他文獻,我猜是bfc應該會引起重排,消耗性能吧。
cssoverflow詳解?
這個問題問的應該是:css中的overflow詳解?參考答案如下:
在CSS中,overflow是“溢出”的意思,該屬性規定當內容溢出元素框時發生的事情,設置內容是否會被修剪,溢出部分是否會被隱藏;例如當屬性值設置為“visible”則內容不會被修剪,為“hidden”則內容會被修剪并且其余內容是不可見的。
overflow屬性支持4個屬性,可設置當內容溢出元素框時的4種處理方式:1、visible 默認值。內容不會被修剪,會呈現在元素框之外。
2、hidden 內容會被修剪,并且其余內容是不可見的。
3、scroll 內容會被修剪,但是瀏覽器會顯示滾動條以便查看其余的內容。
4、auto 如果內容被修剪,則瀏覽器會顯示滾動條以便查看其余的內容。
bfc規則特性?
一,BFC產生規則
1、根標簽(body)
2、float的值不為none
3、overflow的值不為visible
4、display的值為inline-block
5、position的值為absolute或fixed
二,BFC的特性
1、垂直方向排列。(類似塊級特性)
2、BFC內部每個內部標簽都會與左邊界相接觸。(類似塊級特性)
3、屬于同一個BFC的兩個塊元素,垂直margin兄弟關系會折疊(正數以大值為準,有負數正常加減),父子關系會塌陷。
4、BFC區域不會與float的標簽區域重疊。
5、浮動的標簽也會被計算BFC高度。
6、BFC是獨立容器,內部標簽不會影響到外部標簽
確定時怎樣讓子元素的高度始終和父元素同高?
給左浮動的子元素的下一個兄弟元素清除浮動,沒有就添加一個空元素來清除浮動,或者是給父元素 添加overflow: hidden屬性。