在使用z-index这个属性之前,我们必须先了解使用z-index的必要条件:

1、要想给元素设置z-index样式,必须先让它变成定位元素,说的明白一点,就是要给元素设置一个postion:relative(定位元素:position属性值设置除默认值static以外的元素,包括relative,absolute,fixed)样式。

2、不要给想控制“上、下”的元素设置z-index,而是对他们的父容器设置z-index样式。

看懂了以上两点,我们就明白了如何才能使用z-index这个属性,那就是我们在使用z-index前,先将元素定位,例如position:relative;然后再后面再添加z-index:2000就OK了。

教你彻底解决css中设置z-index的值无效的问题的更多相关文章

  1. CSS中设置margin:0 auto; 水平居中无效的原因分析

    很多初学制作网页的朋友,可能会遇到的一个常见问题,就是在CSS中加了margin:0 auto;却没有效果,不能居中的问题,margin:0 auto;的意思就是:上下边界为0,左右根据宽度自适应,其 ...

  2. 在css中设置图片的背景图,怎么设置图片纵向拉伸

    css中设置背景图拉伸填充,在css2.1之前这个背景的长宽值是不能被修改的. 实际的结果是只能重复显示,可以使用repeat,repeat-x,repeat-y,no-repeat这些属性来控制背景 ...

  3. CSS中设置DIV垂直居中的N种方法 兼容IE浏览器

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  4. CSS中设置div垂直居中

    在说到这个问题的时候,也许有人会问CSS中不是有vertical-align属性来设置垂直居中的吗?即使是某些浏览器不支持我只需做少许的CSS Hack技术就可以啊!所以在这里我还要啰嗦两句,CSS中 ...

  5. html5之canvas困惑 在canvas标签内需要设置了宽跟高,如果在css中设置同样的宽跟高,画出来的图像变形了?

    <canvas class="cvs"></canvas> 遇到的问题: 如css 中设.cvs{width:500px;height:400px;},也就 ...

  6. css中设置div水平居中,margin:0px auto无用的情况

    在CSS中加了margin:0px auto;却没有效果,不能实现居中的问题!margin:0px auto;意思就是:上下边界为0.左右依据宽度自适应!就是水平居中的意思.无效的原因是,当你没有设置 ...

  7. CSS中设置border:none和border:0的区别

    在我们设置CSS的时候,对标签元素不设置边框属性或者取消边框属性一般设置为:border:none;或border:0;两种方法均可. border:none;与border:0;的区别体现有两点:一 ...

  8. css中设置background属性

    属性解释 background属性是css中应用比较多,且比较重要的一个属性,它是负责给盒子设置背景图片和背景颜色的,background是一个复合属性,它可以分解成如下几个设置项: backgrou ...

  9. css中设置div水平居中,margin:0px auto没用的情况

    在CSS中加了margin:0px auto;却没有效果,不能实现居中的问题!margin:0px auto;意思就是:上下边界为0,左右根据宽度自适应!就是水平居中的意思.无效的原因是,当你没有设置 ...

随机推荐

  1. 注解:【有连接表的】Hibernate单向1->N关联

    Person与Address关联:单向1->N,[有连接表的] Person.java package org.crazyit.app.domain; import java.util.Hash ...

  2. C语言中运算符的口决

  3. Javascript 学习之路:鼠标长按事件

    <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <title&g ...

  4. 使用postMesssage()实现跨域iframe页面间的信息传递----转载

    由于web同源策略的限制,当页面使用跨域iframe链接时,主页面与子页面是无法交互的,这对页面间的信息传递造成了不小的麻烦,经过一系列的尝试,最后我发现有以下方法可以实现: 1. 子页面url传参 ...

  5. 用js 向h5 中的table 动态添加数据 (简单实现)

    //向 表格传值 function setTextareaValue(items,pp){ console.log(" 进入函数 items=="+items); var tb = ...

  6. PHP入门 - - 05-->编写HTML页面的常用标签

    一.文字版面的编辑 1.格式标签 格式标签用于定义网页中文本的布局.缩进.位置.换行.列表等          <br>           换行          <p>   ...

  7. css整理-06 表和列表

    表格式化 表布局 table, display:table caption, display: table-caption thead, display: table-header-group tbo ...

  8. 【虚拟机】苹果虚拟机mac10.11.6+Xcode8.1

    [虚拟机]苹果虚拟机mac10.11.6+Xcode8.1本虚拟机加装Xcode8.1,方便大家更好学习Swift3.0语言以及iOS开发.安装注意事项:第一步:确认硬件:1.确认主板以及cpu支持虚 ...

  9. PHP 采集

    <?php header("content-type:text/html;charset=gbk"); // 要采集的页面的地址 $url = "http://ww ...

  10. Appium Java Windows环境搭建篇

    1. 安卓SDK及配置环境变量 1.1.先下载sdk安装包:installer_r24.4.1-windows.exe 下载地址:链接: http://pan.baidu.com/s/1dEyPSa9 ...