自拍偷在线精品自拍偷,亚洲欧美中文日韩v在线观看不卡

CSS position固定定位用法揭秘

開發(fā) 前端
CSS中position屬性有四個(gè)屬性值,這里向大家描述一下CSS position固定定位的用法,如果讓一個(gè)元素可能隨著網(wǎng)頁的滾動(dòng)而不斷改變自己的位置,通過CSS position固定定位可以很容易就實(shí)現(xiàn)。

本文向大家介紹一下CSS position固定定位的概念和用法,首先看一下CSS定位的定義,在CSS中關(guān)于定位的內(nèi)容是:position:relative|absolute|static|fixed ,每個(gè)屬性值都有各自的特點(diǎn)和作用。

CSS position固定定位用法揭秘

CSS定位的定義:  

在CSS中關(guān)于定位的內(nèi)容是:position:relative|absolute|static|fixed  

◆static沒有特別的設(shè)定,遵循基本的定位規(guī)定,不能通過z-index進(jìn)行層次分級(jí)?! ?/p>

◆relative不脫離文檔流,參考自身靜態(tài)位置通過top,bottom,left,right定位,并且可以通過z-index進(jìn)行層次分級(jí)?! ?/p>

◆absolute脫離文檔流,通過top,bottom,left,right定位。選取其最近的父級(jí)定位元素,當(dāng)父級(jí)position為static時(shí),absolute元素將以body坐標(biāo)原點(diǎn)進(jìn)行定位,可以通過z-index進(jìn)行層次分級(jí)?! ?/p>

◆fixed固定定位,這里他所固定的對(duì)像是可視窗口而并非是body或是父級(jí)元素??赏ㄟ^z-index進(jìn)行層次分級(jí)?! ?/p>

CSS中定位的層疊分級(jí):

z-index:auto|namber;  

◆auto遵從其父對(duì)象的定位  

◆namber無單位的整數(shù)值??蔀樨?fù)數(shù)

CSS position固定定位

由于廣告的濫用,使得一些瀏覽器軟件都開始有了廣告內(nèi)容攔截,使得一些很好的效果現(xiàn)在都不推薦使用了。比如讓一個(gè)元素可能隨著網(wǎng)頁的滾動(dòng)而不斷改變自己的位置。而現(xiàn)在我可以通過CSS中的一個(gè)定位屬性來實(shí)現(xiàn)這樣的一個(gè)效果,這個(gè)元素屬性就是曾經(jīng)不被支持的position:fixed;他的含義就是:CSS position固定定位。這個(gè)固定與絕對(duì)定位很像,唯一不同的是絕對(duì)定位是被固定在網(wǎng)頁中的某一個(gè)位置,而固定定位則是固定在瀏覽器的視框位置。

【編輯推薦】

  1. 解決IE6 position:fixed 固定定位問題
  2. CSS中三大position屬性值用法解讀
  3. 深入探究DIV CSS布局中position屬性用法
  4. CSS屬性display:inline-block使用揭秘
  5. Firefox、IE7、IE6瀏覽器兼容問題概念解析
責(zé)任編輯:佚名 來源: hi.baidu.com
相關(guān)推薦

2010-09-15 14:56:18

CSSposition:fi

2010-09-10 13:07:51

CSS DIV絕對(duì)定位CSS DIV固定定位

2010-09-15 14:22:05

IE6position

2010-09-08 16:22:32

PositionCSS

2010-08-19 10:33:54

IE6position:fi

2010-09-06 11:11:31

CSS定位

2010-08-31 10:30:59

CSSpositionz-index

2010-08-24 13:34:11

CSSpadding

2010-09-15 13:44:01

CSS positio

2010-09-01 11:21:18

CSSpositionfloat

2010-08-23 09:42:50

CSSPosition

2010-08-25 13:54:29

CSStop

2010-09-06 11:17:19

CSS相對(duì)定位CSS絕對(duì)定位

2010-08-24 15:11:24

PositionCSS

2010-08-26 10:33:27

CSSborder

2010-08-25 14:56:15

CSS相對(duì)定位

2010-09-15 13:50:04

CSSposition屬性

2010-09-06 17:20:04

background-CSS

2010-09-15 14:30:07

CSS backgro

2010-09-15 14:00:06

position屬性DIV
點(diǎn)贊
收藏

51CTO技術(shù)棧公眾號(hào)