img的title和alt有什麼區別？
title：滑鼠移動上去的提示
alt： 圖片載入失敗時，避免使用者體驗不好，給的提示，比如當圖片不存在時，這樣顯示：
清除浮動的幾種方式，各自的優缺點？
浮動：脫離文件流，父元素不計算它的高度，會導致塌陷，影響後邊元素的佈局。
。wrap { border： 1px solid fuchsia； } 。box { width： 200px； background： red； float： left； }
如下圖，父元素本來有一個邊框的，但是由於子元素浮動了，它不會計算浮動元素的高度，就塌陷了。如果我們再繼續寫元素，佈局就亂了，這時候就需要把這一塊隔離開。不影響外邊的元素，同時外邊的元素也不能影響它，這時候就可以清除浮動來解決：
清除浮動的幾種方式：
使用BFC，
BFC計算高度的高度時候，浮動元素也參與計算，啟用BFC的方式：
float的值不是none。
position的值不是static或者relative。
display的值是inline-block、table-cell、flex、table-caption或者inline-flex
overflow的值不是visible
BFC的特點：
內部的box會在垂直方向，一個接一個地放置
同一個
BFC的兩個相鄰box的margin會發生重疊（body也是一個BFC）
每個盒子（塊盒與行盒）的margin box的左邊，與包含塊border box的左邊相接觸（對於從左往右的格式化，否則相反）。即使存在浮動也是如此。
BFC的區域不會與float box重疊。
BFC是頁面上的一個獨立容器，容器裡面的子元素不會影響到外面的元素。反之亦然。
計算BFC的高度時，浮動元素也參與計算（可用來清除浮動）。
給父元素設定：
缺點： IE6 中還需要觸發 hasLayout ，例如為父元素設定容器寬高或設定 zoom：1。
使用空元素，在後面清除浮動
如下圖：
缺點：會新增多餘的空標籤，後期維護麻煩
使用CSS的:after偽元素
如下圖：
缺點：用zoom：1觸發hasLayout。
我是愛美的姑娘，關注我，每天為您分享和複習前端開發的知識點以及常見的面試題、學習的同時還可以瞭解最新的娛樂八卦、幽默搞笑，學習更輕鬆喲
