分享

教你彻底解决css中设置z

 开启美好每一天 2016-10-05
有一个网站,上面挂了百度联盟的广告,今天在看页面时无意间发现,百度联盟的广告被文章中的图片给盖住了,这样不仅影响了百度联盟广告的展示次数,而且还直接影响了网站的外观,最主要的是直接导致联盟点击率的下降,看到这一现象,亦是美网络第一想到的是给广告所在的div代码层里添加z-index代码,以使广告代码永远展示的层的最上面,不料,无论我将z-index的值修改的多大,广告代码依然被文章的图片所覆盖着。

于是就郁闷了,只好上网去查html代码和css样式相关的知识,最终还是找到了原因所在,并且完美解决了这个问题,因为笔者在查找的过程中发现有不少人都在为这个问题而疑惑,所以感觉有必要将问题的解决办法给大家分享一下,好了,废话不多说,进入正题。

在使用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了。

    本站是提供个人知识管理的网络存储空间,所有内容均由用户发布,不代表本站观点。请注意甄别内容中的联系方式、诱导购买等信息,谨防诈骗。如发现有害或侵权内容,请点击一键举报。
    转藏 分享 献花(0

    0条评论

    发表

    请遵守用户 评论公约

    类似文章 更多