css相對(duì)定位詳解 用css怎么讓圖片的位置不隨窗口大小變化而改變其相對(duì)位置?
用css怎么讓圖片的位置不隨窗口大小變化而改變其相對(duì)位置? 位置:相對(duì)|絕對(duì)|靜態(tài)|固定(相對(duì)|絕對(duì)|默認(rèn)|相對(duì)窗口)您需要的是位置:固定相對(duì)于瀏覽器,例如div1{位置:固定頂:0 左:0寬度:1
用css怎么讓圖片的位置不隨窗口大小變化而改變其相對(duì)位置?
位置:相對(duì)|絕對(duì)|靜態(tài)|固定(相對(duì)|絕對(duì)|默認(rèn)|相對(duì)窗口)
您需要的是位置:固定相對(duì)于瀏覽器,例如div1{位置:固定頂:0 左:0寬度:100像素高度:100px}
因此div1固定在瀏覽器的左上角,無(wú)論你滾動(dòng)網(wǎng)頁(yè)或改變大小
但I(xiàn)E6不支持某些地方,小心
絕對(duì)定位是確定相對(duì)于父標(biāo)簽的位置。它通常用于相對(duì)定位標(biāo)簽。通常使用JS效果。
相對(duì)定位是相對(duì)于先前的相對(duì)定位。它一般用于浮動(dòng)定位標(biāo)簽,一般用于絕對(duì)定位。浮動(dòng)定位是常用的。我們來(lái)看一個(gè)例子:下面只說(shuō)明ID name代表div的絕對(duì)位置:位置:絕對(duì)Ifbq1(絕對(duì)定位)外沒(méi)有div這樣的父標(biāo)簽,bq1將以body作為父標(biāo)簽。左邊距正文10像素,上邊距正文10像素。如果bq4(絕對(duì)定位)在bq3(相對(duì)定位)中,左邊距bq3為10像素,上面距bq3為10像素。相對(duì)定位:位置:相對(duì)bq2(相對(duì)定位)始終相對(duì)于上一個(gè)對(duì)等標(biāo)簽作為參考標(biāo)簽(bq1)。Bq3基于bq2。
css相對(duì)定位和絕對(duì)定位用于什么地方?
1. 創(chuàng)建一個(gè)新的HTML文件,輸入兩個(gè)div標(biāo)簽,然后使用style屬性將div分別設(shè)置為絕對(duì)定位和相對(duì)定位,這樣所有div都可以向左移動(dòng)20px,向上移動(dòng)30px:
2。然后保存文件并打開(kāi)瀏覽器查看效果,位置顯示仍然很明顯:
3。最后解釋結(jié)果,絕對(duì)位置是到瀏覽器頁(yè)面左側(cè)和頂部的距離,相對(duì)位置是到正常標(biāo)題的距離。以上是如何在CSS中使用絕對(duì)定位和相對(duì)定位