????定位
????????視覺格式化模型，大體上將頁面中盒子的排列分為三種方式：
????????常規(guī)流????浮動(dòng)：float????定位：position
????????定位：手動(dòng)控制元素在包含塊中的精準(zhǔn)位置
????????涉及的CSS屬性：position
? ? position 屬性
? ??????默認(rèn)值：static，靜態(tài)定位（不定位）
????????relative：相對(duì)定位
????????absolute：絕對(duì)定位
????????fixed：固定定位
? ??一個(gè)元素，只要position的取值不是static，認(rèn)為該元素是一個(gè)定位元素。
????定位元素會(huì)脫離文檔流（相對(duì)定位除外）
????一個(gè)脫離了文檔流的元素：
????文檔流中的元素?cái)[放時(shí)，會(huì)忽略脫離了文檔流的元素
????文檔流中元素計(jì)算自動(dòng)高度時(shí)，會(huì)忽略脫離了文檔流的元素
????相對(duì)定位
? ? ?不會(huì)導(dǎo)致元素脫離文檔流，只是讓元素在原來位置上進(jìn)行偏移。
? ? ?可以通過四個(gè)CSS屬性對(duì)設(shè)置其位置：
? ? ?left????right????top????bottom
? ? ?盒子的偏移不會(huì)對(duì)其他盒子造成任何影響。
????絕對(duì)定位
????寬高為auto，適應(yīng)內(nèi)容
????包含塊變化：找祖先中第一個(gè)定位元素，該元素的填充盒為其包含塊。若找不到，則它的包含塊為整個(gè)網(wǎng)頁（初始化包含塊）
????固定定位
????其他情況和絕對(duì)定位完全一樣。
????包含塊不同：固定為視口（瀏覽器的可視窗口）
? ?定位下的居中
????某個(gè)方向居中：
????????定寬（高）
????????將左右（上下）距離設(shè)置為0
????????將左右（上下）margin設(shè)置為auto
? ? 絕對(duì)定位和固定定位中，margin為auto時(shí)，會(huì)自動(dòng)吸收剩余空間
? ?多個(gè)定位元素重疊時(shí)
????堆疊上下文
????設(shè)置z-index，通常情況下，該值越大，越靠近用戶
????只有定位元素設(shè)置z-index有效
????z-index可以是負(fù)數(shù)，如果是負(fù)數(shù)，則遇到常規(guī)流、浮動(dòng)元素，則會(huì)被其覆蓋
????補(bǔ)充
? ? ?絕對(duì)定位、固定定位元素一定是塊盒
? ? ?絕對(duì)定位、固定定位元素一定不是浮動(dòng)
? ? ?沒有外邊距合并
????透明度
? ? ?opacity，它設(shè)置的是整個(gè)元素的透明，它的取值是0 ~ 1
? ? ?在顏色位置設(shè)置alpha通道(rgba )
? ??鼠標(biāo)
? ? ?使用cursor設(shè)置
? ? 盒子隱藏
? ? ?display:none，不生成盒子
? ? ?visibility:hidden，生成盒子，只是從視覺上移除盒子，盒子仍然占據(jù)空間。
????背景圖
????和img元素的區(qū)別????????img元素是屬于HTML的概念????????背景圖屬于css的概念
? ? ? ? 1.當(dāng)圖片屬于網(wǎng)頁內(nèi)容時(shí)，必須使用img元素
? ? ? ? 2. 當(dāng)圖片僅用于美化頁面時(shí)，必須使用背景圖
????涉及的css屬性
? ? ? ? 1.background-image
? ? ? ? 2.background-repeat
????默認(rèn)情況下，背景圖會(huì)在橫坐標(biāo)和縱坐標(biāo)中進(jìn)行重復(fù)
? ? ? ? 3.background-size
????預(yù)設(shè)值：contain、cover，類似于object-fit 數(shù)值或百分比
? ? ? ? 4.background-position
????設(shè)置背景圖的位置。
????????預(yù)設(shè)值：left、bottom、right、top、center
????數(shù)值或百分比
????????雪碧圖（精靈圖）（spirit）
? ? ? ? 5.background-attachment
????通常用它控制背景圖是否固定。
? ? ? ? 6.背景圖和背景顏色混用
? ??????
