Z-INDEX: 999什么意思

1HTML代码给出了内层的3个div,显示的数字即为z-index数值

<divclass="outer">

    <divclass="con1">99</div>

    <divclass="con2">999</div>

    <divclass="con3">9</div>

</div

2添加css样式,注意内层div的定位方式为relative,并且分别设置了z-index数值

div.outer{width:350px;height:350px;padding:10px;border:1pxsolidgreen;}

div.outer div{width:200px;height:200px;padding:05px;color:white;font-size:20px;position:relative;}

div.con1{background:red;top:20px;left:20px;z-index:99;}

div.con2{background:green;top:-100px;left:0px;z-index:999;}

div.con3{background:blue;top:-250px;right:-100px;text-align:right;z-index:9;


©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 1. tab列表折叠效果 html: 能源系统事业部 岗位名称: 工作地点 岗位名...
    lilyping阅读 1,923评论 0 1
  • 一、 网页布局方式 1、什么是网页布局方式 布局可以理解为排版,我们所熟知的文本编辑类工具都有自己的排版方式 比如...
    强哥科技兴阅读 401评论 0 1
  • 本书介绍 你是不是对Django的学习感到迷茫?是不是对网上零星的教程感到绝望?是不是苦于没有可以迅速上手的实例而...
    阡陌3536阅读 1,340评论 0 0
  • 一只神奇的喵 我相信每个人的童年都有一个哆啦a梦,一个小小的肚皮里装满了不可思议的哆啦a梦,一个在你无助伤心的时候...
    Iris_mao阅读 996评论 2 7
  • 我是谁的月?谁是我的地? 流光常向君,度影驶君心。 昊塬拂天下,青丝成白雪。 借我向心力,转运万里引。(表意,万有...
    小布点简阅读 395评论 0 4