首頁  >  文章  >  web前端  >  css中的position(定位)

css中的position(定位)

巴扎黑
巴扎黑原創
2017-06-27 09:05:181302瀏覽

一、position語法與結構

position語法: position : static absolute relative 

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進行絕對定位。

三、css絕對定位總結

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

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

以上是css中的position(定位)的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
上一篇:markdown基礎下一篇:markdown基礎