如何控制CSS使一个div位于最上层

html-css06

如何控制CSS使一个div位于最上层,第1张

设置style 中 z-index:auto

auto可定义为一个值(整数数字),越大代表越置前,如可定义为: z-index:999。

若定义为-1,代表为最底层。

div的图层由div的style中的z-index来决定,z-index是层垂直屏幕的坐标,0最小,越大的话位置越靠上。

使用z-index属性,例如z-index:1000,数值越大所在层显示的越靠前面,区分两层的显示顺序就可以分别将两层的显示值设置,这样就可以分别出这两层的显示情况。前提是将所显示的层定位,z-index只作用于定位的元素。

将底部的内容定位到顶部,只要在css层上面加上一个浮动,将定位至top设置成0即可。说明如下:

position:absolute(将对象浮动)

top:0(将对象定位对顶部)

整体css示范如下:

<div style="position:absolute top:0 width:100% height:50px background:#000 color:#FFF text-align:center">内容顶部</div>

如要将内容放至底部,只需将top:0修改成bottom:0即可,整体css未范如下:

<div style="position:absolute bottom:0 width:100% height:50px background:#000 color:#FFF text-align:center">内容底部</div>

希望我的回答能令你满意!