CSS中的定位屬性可以用來控制元素在頁面中的位置,其中fixed和absolute是比較常用的兩種定位方式。
/* fixed */ position: fixed; top: 0; left: 0; /* absolute */ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
fixed定位是相對于瀏覽器窗口的位置確定元素的位置的,因此當頁面滾動時,元素將保持在固定的位置。
absolute定位是相對于最近一個已定位的祖先元素的位置來確定元素的位置的。如果沒有已定位的祖先元素,則元素將相對于瀏覽器窗口進行定位。absolute定位可以用來在一個容器內(nèi)部定位一個元素,并且可以利用transform屬性來使元素水平垂直居中。
/* 在一個容器內(nèi)水平垂直居中 */ position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);
總的來說,fixed和absolute定位是兩個有用的CSS屬性,可以幫助我們更好地控制元素在頁面中的位置。