css中的position(定位)

2023-02-07 07:16:04 字數 643 閱讀 7750

position引數:

static:  無特殊定位,物件遵循html定位規則

absolute:  將物件從文件流中拖出,使用left,right,top,bottom等屬性進行絕對定位。而其層疊通過css z-index屬性定義。此時物件不具有邊距,但仍有補白和邊框

relative:  物件不可層疊,但將依據left,right,top,bottom等屬性在正常文件流中偏移位置

position:absoluteposition:relative絕對定位使用通常是父級定義position:relative定位,子級定義position:absolute絕對定位屬性,並且子級使用left或right和top或bottom進行絕對定位。

絕對定位如果父級不使用position:relative,而直接使用position:absolute絕對定位,這個時候將會以body標籤為父級,使用position:absolute定義物件無論位於div多少層結構,都將會被拖出以為父級(參考級)進行絕對定位。

在絕對定位時候我們可以使用css z-index定義css層重疊順序。

css定位中的position

absolute,position,relative 之前老弄不明白,只能憑藉一點短期內 虐出來的經驗 製作需要的效果,後來仔細研究了一下hutia的xscroller,並且仔細看了文件,才知道這個position屬性其實是指本體對上級的定位。如果這麼理解,就好辦了。預設的屬性值都是static,靜...

css中的position定位和z index屬性

html div設定z index無效 url url z index 屬性簡介 z index auto number auto 預設值。number 無單位的整數值,可為負數 color red b z index 值較大的元素將疊加在 z index 值較小的元素之上。對於未指定此屬性的定位物...

CSS中的position定位

css中的定位可以幫助我們對頁面進行美化,css中的定位主要分為靜態定位,相對定位,絕對定位,固定定位這四種。一般情況下,定位還會跟隨不同的引數,例如top,bottom,left,right,z index等。下面,我們就詳細瞭解一下這些定位。1.靜態定位 position static 一幫的標...