css之定位

琨琨12138發表於2019-02-21

定位分為4種方式:靜態定位,相對定位,絕對定位

靜態定位:position:static

相對定位:position:relative

  根據自身原來的位置定位,沒有脫離標準流

絕對定位:position:absolute

  1.定位的元素沒有父元素的情況下,根據瀏覽器的可視區域定位;

  2.定位的元素有父元素,父元素無定位(或父元素有靜態定位),根據瀏覽器可視區域定位;

  3.定位的元素有父元素,父元素有定位(非靜態),根據父元素定位;

固定定位:position:fixed

  根據瀏覽器可視區域定位,與父元素無關

定位的元素如果要在父元素中垂直水平居中:

  top:50%     margin-top: -(定位元素高度的一半);

  left:50%     margin-left: -(定位元素寬度的一半);

層級:z-index  只能給定位的元素新增  預設值:auto

  數值越大,層級越高,盒子越靠上

相關文章