常用CSS樣式3:定位
#定位
##關於定位
我們可以使用css的position屬性來設定元素的定位型別,postion的設定項如下:
- relative 生成相對定位元素,元素所佔據的文件流的位置不變,元素本身相對文件流的位置進行偏移
- absolute生成絕對定位元素,元素脫離文件流,不佔據文件流的位置,可以理解為漂浮在文件流的上方,相對於上一個設定了相對或者絕對或者固定定位的父級元素來進行定位,如果找不到,則相對於body元素進行定位。
- fixed 生成固定定位元素,元素脫離文件流,不佔據文件流的位置,可以理解為漂浮在文件流的上方,相對於瀏覽器視窗進行定位。
- static 預設值,沒有定位,元素出現在正常的文件流中,相當於取消定位屬性或者不設定定位屬性
- inherit 從父元素繼承position 屬性的值
##定位元素特性
絕對定位和固定定位的塊元素和行內元素會自動轉化為行內塊元素
##定位元素層級
定位元素是浮動的正常的文件流之上的,可以用z-index屬性來設定元素的層級
##典型定位佈局
1、固定在頂部的選單
2、水平垂直居中的彈框
3、固定的側邊的工具欄
4、固定在底部的按鈕
學院Go語言視訊主頁
https://edu.csdn.net/lecturer/1928
清華團隊帶你實戰區塊鏈開發
掃碼獲取海量視訊及原始碼 QQ群:721929980
相關文章
- 1.8 常用CSS樣式3:定位CSS
- 常用CSS樣式2:其它樣式CSS
- 常用CSS樣式1:文字樣式CSS
- 1.5 常用CSS樣式1:文字樣式CSS
- 1.6 常用CSS樣式2:其它樣式CSS
- css樣式常用的樣式以及選擇器CSS
- 常用CSS樣式2:浮動CSS
- 1.7 常用CSS樣式2:浮動CSS
- css常用樣式彙總記錄CSS
- CSS3製作圖片樣式CSSS3
- css樣式CSS
- 001---css樣式規則及css字型樣式CSS
- css字型樣式CSS
- css背景樣式CSS
- scss樣式常用CSS
- 匯入式CSS樣式CSS
- 常用的Css函式CSS函式
- 基於jq的bootstrap 常用樣式demo 引入css jq js檔案後樣式出現bootCSSJS
- Web前端開發——CSS層疊樣式表(3)Web前端CSS
- css樣式簡寫CSS
- css修改title樣式CSS
- CSS 樣式防禦CSS
- css 樣式清零CSS
- CSS滑鼠樣式(cursor)CSS
- CSS樣式繼承CSS繼承
- CSS3常用屬性CSSS3
- CSS定位CSS
- CSS——定位CSS
- W3school的CSS筆記(定位)CSS筆記
- 使用css3實現思維導圖樣式示例CSSS3
- CSS 設定 <progress>樣式CSS
- css字型樣式屬性CSS
- 引入CSS樣式 筆記CSS筆記
- CSS input 文字框樣式CSS
- CSS input文字框樣式CSS
- CSS 設定列表樣式CSS
- CSS 設定文字樣式CSS
- CSS 背景樣式和列表CSS