CSS之Position相對定位和絕對定位

2021-07-30 05:45:35 字數 332 閱讀 9392

absolute的英文意思是絕對的意思,實際上是針對父級元素元素定位,如果父級元素沒有position:relative|absolute,則追至再上乙個父級元素,直至相對於文件的左上角定位,按照我們中國人的理解觀念,這個其實是相對定位,是脫離文件流的。用了abolute屬性,原有float屬性將失效;

relative的英文意思是相對的意思,實際上是相對於物件當前位置的定位。而且是不脫離文件流的,就算用top、lef、bottom、right或margin將其移動位置,它也會在原來的文件流中占有自己實際大小的一塊位置。

說白了,absolute是相對于父物件定位,relative是相對於當前位置定位!就是這麼簡單

position 的相關屬性(絕對定位 相對定位)

是更具最近的定位父級進行定位的,如果沒有確定定位父級,就以瀏覽器視窗進行定位。比如 position absolute left 20px top 80px 這個容器始終位於距離瀏覽器左20px,距離瀏覽器上80px的這個位置。未設定 left top right bottom 的時候,元素還在自己...

css中position的絕對定位和相對定位

什麼是文件流?將窗體自上而下分成一行行,並在每行中按從左至右的順序排放元素,即為文件流。只有三種情況會使得元素脫離文件流,分別是 浮動 絕對定位和相對定位。靜態定位 static static,無特殊定位,它是html元素預設的定位方式,即我們不設定元素的position屬性時預設的position...

CSS 屬性之 position講解

postion 屬性定義了乙個元素在頁面布局中的位置以及對周圍元素的影響。該屬性共有5個值 position static position inherit position relative position absolute position fixed 依次講解這5個值的應用。position...