解決高度塌陷
? ? 清除浮動(dòng):將最后一個(gè)盒子設(shè)為空白盒子再clear:both堕油;就可以撐開父元素潘飘,防止高度塌陷
? ? 用after在后面加入內(nèi)容,為兼容ie6需加zoom? eg:.clearfix:after{content:"";display:block掉缺;clear:both福也;}
? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? ? .clearfix{zoom:1;}?? 【最推薦使用】
定位:元素開啟定位后比文檔流高一層
? ? ? ?? position:
? ? ? ? ? ? ? ? ? static:默認(rèn)值攀圈,沒有定位
? ? ? ? ? ? ? ? ? relative:{position:relative暴凑;left:100px;top:200px赘来;}
? ? ? ? ? ? 相對(duì)定位相對(duì)于元素在文檔流原來的位置
? ? ? ? ? ? 開啟相對(duì)定位后不會(huì)影響元素性質(zhì)
? ? ? ? ? ? ? ? ? absolute:元素相對(duì)于html元素或離他最近 的祖先定位元素進(jìn)行定位(一般幫他的父元素先開啟相對(duì)定位)
? ? 絕對(duì)定位现喳,會(huì)使元素完全脫離文本流
? ? 開啟絕對(duì)定位后會(huì)影響元素性質(zhì)
? ? 絕對(duì)定位的塊元素的寬度會(huì)被其內(nèi)容撐開
? ? ? ? ? ? ? ? ? fixed:固定定位凯傲,元素會(huì)被鎖定在屏幕的某個(gè)位置上,網(wǎng)頁滾動(dòng)時(shí)保持不動(dòng)
? ? ? ? ? ? ? ? ? (開啟以上三種定位后可使用(top嗦篱、right冰单、bottom、left)屬性)
? ? ? ?? z-index:元素開啟定位后可使用灸促,可提升定位元素所在的層級(jí)
? ? ? ? ? ? ? ? ? 可指定一個(gè)整數(shù)作為參數(shù)诫欠,值越大優(yōu)先級(jí)越高,顯示在網(wǎng)頁上層
? 未開啟定位則不可以使用
opacity:設(shè)置透明浴栽,0為完全透明荒叼,1為完全不透明;
filter:alpha(opacity=50):一般也會(huì)加上這個(gè)濾鏡用于支持ie瀏覽器(選值0~100)
background-image:url(圖片路徑)
一般設(shè)置背景圖片時(shí)同時(shí)指定背景顏色
background-repeat:設(shè)置是否重復(fù)背景圖
? ? ? ? ? ? ? ? ? repeat?? 重復(fù)圖片
? ? ? ? ? ? ? ? ? no-repeat? 不重復(fù)典鸡,只一張
? ? ? ? ? ? ? ? ?? repeat-x? 只橫排重復(fù)
? ? ? ? ? ? ? ? ?? repeat-y? 只豎排重復(fù)
background-position:設(shè)置背景圖像的起始位置?
? ?? eg:background-position:bottom center被廓;可選值一個(gè)設(shè)為橫,一個(gè)為豎?
? ?? eg:background-position:100px 200px萝玷;
background-attachment:設(shè)置背景圖片是否會(huì)隨著頁面其余部分的滾動(dòng)而滾動(dòng)
小注意點(diǎn):如父子元素則子元素永遠(yuǎn)在父元素之上
? 相對(duì)路徑寫到哪兒便從哪兒開始找