CSS(Cascading Style Sheets)是一種用于定義網頁樣式和布局的語言。在CSS中,定位是一種重要的樣式屬性,它可以用來控制元素的位置、層疊順序及其與其他元素之間的關系。
position: static|relative|absolute|fixed|sticky; top: value; bottom: value; left: value; right: value; z-index: value;
position屬性指定一個CSS元素在文檔流中的定位方式,該屬性共有五種取值。static是默認值,表示元素將根據文檔流進行定位;relative表示元素相對于它自己的原始位置進行定位;absolute表示元素相對于離他最近的已定位的父元素進行定位;fixed表示元素相對于瀏覽器窗口進行定位;sticky表示元素在滾動條滾動時會“粘”在指定的位置,直到它到達這個容器邊界。
top、bottom、left、right屬性是相對定位和絕對定位最常用的樣式屬性,用于指定元素的位置。top屬性表示元素上邊緣與包含元素的上邊緣之間的距離;bottom屬性表示元素下邊緣與包含元素的下邊緣之間的距離;left和right屬性則分別指定元素相對于包含元素左邊緣和右邊緣的距離。
z-index屬性控制元素的層疊順序,定義哪個元素顯示在前面或在后面。它的取值范圍是從負無窮到正無窮,數值越大,元素越靠前顯示。如果兩個元素的z-index值相等,先出現在HTML代碼中的元素將在另一個元素的前面顯示。
上一篇css定位部分背景
下一篇css定位精靈圖實例