CSS是前端開發中非常重要的一部分,定位是CSS中的一個重要概念。據統計,CSS有五種定位。
CSS定位一共有五種,分別是:
1. static 2. relative 3. absolute 4. fixed 5. sticky
其中,static是默認的定位方式,也就是說如果沒有設置任何的定位方式,那么元素就會使用static定位。
相對定位(relative)是相對于自身原來的位置來定位,只有在元素使用了相對定位之后,才能使用top、left、bottom、right等屬性來進行調整。
絕對定位(absolute)是相對于最近的已定位祖先元素來進行定位的。如果沒有已定位的祖先元素,那么將會相對于文檔的body元素來定位。想要使用絕對定位,必須先使用position屬性來定義為absolute。
固定定位(fixed)與絕對定位的原理相同,只是相對的參考改為了瀏覽器窗口而不是祖先元素。在滾動頁面時,固定定位元素總是保持在相同的位置。
粘性定位(sticky)是最新的定位方式,它的表現類似于相對定位和固定定位的結合體,當元素在屏幕中可見時,它的位置是相對于文檔流中的位置定位的,但在滾動超過特定閾值后,它的位置將變為固定定位。粘性定位可以實現當元素到達屏幕邊緣時固定在相應位置的效果。
以上就是CSS定位方式的簡單介紹,掌握定位的使用,對于寫出漂亮的網頁布局非常重要。
上一篇mysql怎么裝服務器上
下一篇mysql怎么表示一對多