position–定位
relative – 相對；
absolute – 絕對；
static – 無定位；
fixed – 固定。
相對定位
相對定位的偏移參考元素是元素本身，不會使元素脫離文件流，元素的初始衛視佔據的控制項會被保留；
語法：position:relative；
相對定位的偏移是自己之前的位置作為參照進行的乙個偏移；
相對定位不作為元素單獨顯示出來，而是作為父容器去包含其他元素而使用；
子絕父相 – （子元素設定絕對定位，父元素設定相對定位）。
絕對定位
絕對定位相對於已定位的最近的祖先元素，如果沒有已定位的最近的祖先元素，那麼他的位置就像對於最初的包含塊（body）；
語法：position:absolute。
舉例：
<
!doctype html>
購物車<
/title>
"utf-8"
>
"stylesheet" type=
"text/css" href=
"class code4.css"
>
<
/head>
="div1"
>
="div2"
>
="div3"
>
5<
/div>
"cart.svg"
>
<
/div>
<
/div>
<
/body>
<
/html>
.div1
.div2
img.div3
z-index
先**演示：
<
!doctype html>
層疊<
/title>
"utf-8"
>
"stylesheet" type=
"text/css" href=
"class code3.css"
>
<
/head>
="div0"
>
="div1"
>
<
/div>
="div2"
>
<
/div>
="div3"
>
<
/div>
<
/div>
<
/body>
<
/html>
.div0
/*以下是使用絕對定位展現出層疊效果*/
/*div1是在最下方，div3是最上方*/
/*加入z-index屬性，從而使得div1在最上方，div3在最下方*/
/*z-index中的數值不宜過大或過小，目的是為了方便日後專案中新增別的元素*/
.div1
.div2
.div3
固定定位
相對於瀏覽器視窗進行定位；
語法：position:fixed
**演示：
<
!doctype html>
固定定位<
/title>
"utf-8"
>
"stylesheet" type=
"text/css" href=
"practice6.css"
>
<
/head>
="div1"
>
<
/div>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
/p>
<
/body>
<
/html>
.div1
說明：隨著滾輪滾動，上方的紅色方塊不會隨著進度條進行移動，而是固定不動的。
HTML 從零開始的學習過程 1
1.html的概念 html hyper text markup language 超文字標記語言，使用一系列的標籤對文件 圖示以及其他資訊資源進行統一關聯。特點 1.不需要編譯，直接由瀏覽器執行 2.文字檔案 3.檔案字尾名為html 4.對大小寫不敏感。2.html基礎語法部分 基本結構 doc...
HTML 從零開始的學習過程（3）
結構 標題 caption 表頭 th 頭，內容居中顯示，加粗顯示 tr thead 主體 td 表體，預設靠左顯示，不加粗 tr tbody table 腳注 td 表體，預設靠左顯示，不加粗 tr tfoot body 屬性 frame 外部邊框樣式 void，不顯示外側邊框 above，顯示上...
HTML 從零開始的學習過程（5）
概念 css層疊樣式表 cascading style sheets 一種用來表現html或xml的語言。作用 結構與樣式分離的方式，便於後期的維護和修改 可以用多套樣式，使網頁有任意樣式切換的效果 使得頁面載入的更快，降低伺服器的成本。樣式分類 1.內部樣式 utf 8 document titl...