- 檔案流：
普通流：上至下，左至右
浮動流：元素添加了float：；
定位流：添加了定位屬性
- 定位 position:;
static 默認值
absolute 絕對定位(脫離檔案流，不占位；默認參考瀏覽器零點)
relative 相對定位（占據檔案流，占位置；參考自身加載在頁面中的位置）
fixed 固定（脫離檔案流，不占位；元素固定在頁面中，不隨頁面滾動而滾動；默認參考瀏覽器零點）
sticky 粘性定位（頁面達到一定高度時，脫離檔案流；效果是吸附瀏覽器頂部）（結合了relative和fixed的特征）
坐標位置 水平 left right
垂直 top bottom
- 包含塊：
形成嵌套結構，且父級元素有設定定位position：relative；
- absolut和relative的區別：
1、是否占據檔案流， absolute占據，relative不占據
2、參考物不同，absolute參考html，relative參考自身
- 層級關系 z-index:;
前提條件：有定位的元素才能設定層級關系
auto 默認值0
number 具體數字，可以為負數
并列關系：改變任一元素的層級關系都可以
嵌套關系：只能改變子集的層級關系
- 元素居中方式
第一種：
position:absolute; ==>子元素改變子集位置
top:0p;
right:0px;
bottom:0px;
left:0px;
margin:auto; ==>自適應
第二種：
position:absolute; ==>子集作為被參考物
top:50%;
left:50%;
margin-left:寬度值一半的px;
margin-top:高度值一半的px;
- 錨點鏈接
1、點擊位置 <a href=https://www.cnblogs.com/strongerPian/p/#name"">點擊位置</a>
2、確定跳轉位置 <標簽 id="name">指定跳轉的位置</標簽>
3、頁面高度足夠
轉載請註明出處，本文鏈接：https://www.uj5u.com/qiye/63809.html
標籤：Html/Css