CSS中,可以使用定位属性来控制元素在窗口中的位置。常用的有三种定位属性:相对定位、绝对定位和固定定位,它们分别是:position:relative、position:absolute、position:fixed。
相对定位是相对于元素原来在窗口中的位置进行移动。可以使用top、bottom、left、right属性来控制元素的移动方向和距离。如下面的例子:
div{ position:relative; left:50px; top:50px; }
这段代码表示,将一个div元素向窗口右下方移动50个像素。
绝对定位是相对于最近一个已定位的父元素进行定位。如果没有已定位的父元素,则相对于文档的body元素进行定位。也可以使用top、bottom、left、right属性来控制元素的位置。
div{ position:absolute; right:0; bottom:0; }
这段代码表示,将一个div元素定位在窗口的右下角。
固定定位是相对于窗口进行定位的。当滚动窗口时,元素位置不变。同样也可以使用top、bottom、left、right属性来控制元素的位置。
div{ position:fixed; top:0; left:0; }
这段代码表示,将一个div元素固定在窗口的左上角。
除了定位属性,CSS中还有其他属性可以控制元素的位置,如float、clear、display等。学好这些属性,就能轻松地控制元素在窗口中的位置。