絕對定位
固定定位
定位下的居中
多個定位元素重疊時z-index
補充@規則
定位：手動控制元素在包含塊中的精準位置
-預設值： static，靜態定位(不定位)
-relative：相對定位
乙個元素，只要position的取值不是static，認為該元素是乙個定位元素
定位元素會脫離文件流（相對定位除外）
脫離文件流後：
1.文件流擺放時，會忽略脫離了文件流的元素
2.文件流元素計算自動高度時，會忽略脫離了文件流的元素
不會導致元素脫離文件流，只是讓元素在原來位置偏移
（大多給絕對定位元素提供包含塊）
四個屬性設定其位置
-left
-right
-top
-bottom
出現矛盾的時候 以左 上為準
與margin區別: margin會使盒子整體變短
盒子的偏移不會對其他盒子造成影響（只視覺效果）
1.寬高為auto時 適應內容
2.包含塊變化：找祖先元素中 第乙個定位 元素，該元素的填充盒為其包含塊 eg.left:0; 就左對齊到上乙個定位元素 若找不到 則它的包含塊為整個網頁（初始化包含塊）
關鍵在找到包含塊在哪
其他情況和絕對定位完全一樣
包含塊不同：固定為視口（瀏覽器的可視視窗） 能看見的網頁面積 視口不會變
（網頁廣告）
某個方向居中：
1.定寬（高）
2.將左右（上下）距離設定為0 -right -left 為0
3.將左右（上下）margin設定為auto
margin 吸收完剩餘空間
堆疊上下文
設定z-index（z座標軸）
值越大 越靠近使用者
只有定位元素設定z-index有效
z-index 可以是負數 常規流浮動流 覆蓋負數元素
.a .b1.絕對定位 固定定位 一定是塊盒
相對定位不影響盒屬性
2.絕對定位 固定定位 一定不是浮動元素 加float沒用
3.定位沒有外邊距合併
放在.css檔案中
at-rule @規則 @語句 css語句 css指令 （不同翻譯）
@import"路徑"；
匯入另外乙個css檔案
類似在html裡 link
先解析 @ 中的css 同link順序
@charset 「utf」
告訴瀏覽器字元編碼
必須寫第一行
同html裡的utf-8
CSS定位規則之BFC
1.bfc的定義 bfc block formatting context,中文常譯為塊級格式化上下文 是w3c css 2.1 規範中的乙個概念，它決定了元素如何對其內容進行定位，以及與其他元素的關係和相互作用。在進行盒子元素布局的時候，bfc 提供了乙個環境，在這個環境中按照一定規則進行布局不會...
css 定位連線 css絕對定位
定位的四種模式 static,relative,absolute,fixed 定位的四個位置 left,right,top,bottom 定位屬性 position,有四種狀態值 1.static 靜態定位,按元素在文件流中的順序排列,這是預設值,四個位置無效 2.relative 相對定位,元素相...
CSS定位 浮動定位
css定位機制 浮動定位 float屬性 進行浮動定位 left，right clear屬性 清除浮動 left，right，both float屬性 1.概述 div實現橫向多列布局 float屬性 left 左浮動 right 右浮動 none 不浮動 下圖為 的實現 float屬性用途 在 混...