常用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系列:CSS常用樣式CSS
- 常用CSS樣式2:其它樣式CSS
- 常用CSS樣式1:文字樣式CSS
- 1.5 常用CSS樣式1:文字樣式CSS
- 1.6 常用CSS樣式2:其它樣式CSS
- css樣式常用的樣式以及選擇器CSS
- 常用CSS樣式2:浮動CSS
- 『總結』CSS/CSS3常用樣式與web移動端資源CSSS3Web
- 1.7 常用CSS樣式2:浮動CSS
- css常用樣式彙總記錄CSS
- CSS3(三)佈局樣式CSSS3
- CSS3製作圖片樣式CSSS3
- css樣式CSS
- CSS系列:CSS文字樣式CSS
- CSS系列:CSS表格樣式CSS
- CSS重置樣式CSS
- css字型樣式CSS
- css背景樣式CSS
- 001---css樣式規則及css字型樣式CSS
- 匯入式CSS樣式CSS
- Web前端開發——CSS層疊樣式表(3)Web前端CSS
- 13種常用按鈕、文字框、表單等CSS樣式CSS
- 基於jq的bootstrap 常用樣式demo 引入css jq js檔案後樣式出現bootCSSJS
- 常用的Css函式CSS函式
- CSS入門指南-3:定位元素CSS
- CSS3背景圖的定位技巧CSSS3
- CSS 樣式防禦CSS
- css修改title樣式CSS
- css樣式簡寫CSS
- css 樣式清零CSS
- Css基本樣式————文字CSS
- CSS的基本樣式CSS
- 認識CSS樣式CSS
- CSS樣式簡介CSS
- CSS常見樣式CSS
- CSS滑鼠樣式整理CSS
- CSS滑鼠樣式(cursor)CSS