目錄二:**實現左右浮動邊框
三:浮動造成父標籤塌陷問題(清除浮動)
三:清除浮動的***（父標籤塌陷問題）
四:overflow溢位屬性
五:**溢位的應用場景
一:浮動float
1.什麼是浮動？
在 css 中，任何元素都可以浮動。
浮動元素會生成乙個塊級框，而不論它本身是何種元素
只要是設計到頁面的布局一般都是用浮動來提公升規劃好4.float格式
float: ;
三種取值
left : 向左浮動
right : 向右浮動
none : 預設值，不浮動
三:浮動造成父標籤塌陷問題(清除浮動)
1.浮動會造成父標籤的影響
三:清除浮動的***（父標籤塌陷問題）
1.自己加乙個div設定高度
#d4
2.利用clear屬性#d4
之後只要標籤出現了塌陷的問題就給該塌陷的div標籤加乙個class=「clearfix」屬性即可
四:overflow溢位屬性值描述
visible
預設值。內容不會被修剪，會呈現在元素框之外。
hidden
內容會被修剪，並且其餘內容是不可見的。
scroll
內容會被修剪，但是瀏覽器會顯示滾動條以便檢視其餘的內容。
auto
如果內容被修剪，則瀏覽器會顯示滾動條以便檢視其餘的內容。
inherit
規定應該從父元素繼承 overflow 屬性的值。
1.當**出現溢位時
2.解決**溢位
/*overflow: visible; !*預設就是可見 溢位還是展示*!*/
/*overflow: hidden; !*溢位部分直接隱藏*!*/
/*overflow: scroll; !*下拉框滾動*!*/
/*overflow: auto; !*滾動顯示 當寬度比較小有下側滑動*!*/
時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!時間會給我們答案,那就讓時間來給我們答案吧!!!
五:**溢位的應用場景
1.實現個人頭像
2.解決設定頭像**溢位問題
解決設定頭像**溢位問題與比列大小問題
/*溢位位置隱藏*/
overflow: hidden;
}#d1>img
3.圓形頭像示例
前端 CSS基礎（八）浮動
視覺格式化模型，大體上將頁面中盒子的排列分為三種方式 常規流浮動 定位文字環繞 橫向排列 修改float屬性值為 預設值為none 不浮動，為常規流 當乙個元素浮動後，元素必定為塊盒 更改display屬性為block 浮動元素的包含塊，和常規流一樣，為父元素的內容盒 寬度為auto時，適應內容寬度...
前端基礎筆記 CSS 04 浮動
清除浮動 1.普通流 標準流 2.浮動 讓盒子從普通流中浮起來，主要作用是讓多個塊級盒子在一行內顯示。3.定位 將某個盒子定位在瀏覽器的某一固定位置。float的語法 選擇器 例1 兩個普通流塊級元素各佔一行從上到下順序排列 當給乙個元素設定浮動之後，它就會 飄起來 例2 將三個塊級元素設定disp...
前端基礎之css
css 規則由兩個主要的部分構成 選擇器，以及一條或多條宣告。selector 例如 2.1 行內式 行內式是在標記的style屬性中設定css樣式。這種方式沒有體現出css的優勢，不推薦使用。hello michael 2.2 嵌入式 嵌入式是將css樣式集中寫在網頁的標籤對的標籤對中。格式如下 ...