CSS定位屬性(position)是CSS中非常重要的一個(gè)屬性,通過(guò)它我們可以精確地定位某一個(gè)元素的位置,以下是一些常用的定位屬性:
position: static; position: relative; position: absolute; position: fixed;
下面我們來(lái)看一些常用的實(shí)例及其用法:
1、static(默認(rèn)值)
這種定位方式不會(huì)對(duì)元素進(jìn)行定位,元素位置會(huì)保持在文檔流中,默認(rèn)值為static。
div{ position: static; }
2、relative
相對(duì)定位是通過(guò)設(shè)置元素相對(duì)于其正常位置進(jìn)行定位,定位后仍然占據(jù)原來(lái)的文檔流空間。
div{ position: relative; top: 10px; left: 20px; }
3、absolute
絕對(duì)定位是通過(guò)設(shè)置元素相對(duì)于其最近的非static定位祖先元素進(jìn)行定位。
div{ position: absolute; top: 50px; left: 100px; }
4、fixed
固定定位會(huì)使元素相對(duì)于瀏覽器窗口進(jìn)行定位,該元素不會(huì)隨滾動(dòng)條的滾動(dòng)而滾動(dòng)。
div{ position: fixed; top: 0px; left: 0px; }
以上就是一些CSS定位屬性的基本用法,善加利用它們會(huì)讓我們的頁(yè)面更加美觀。
下一篇css左下角倒角