CSS：当我追加新的div元素时，z-index不能正常工作
我想实现关于绘制由div元素配置的一些矩形和贴纸的网站。
要添加标签或矩形，请单击按钮。
我想按以下顺序排列div元素
（上）贴纸>机架>矩形>帆布（下）
所以我在样式表中使用了z-index。
#canvas { position: relative; z-index: 1; ... } .rectangle { position: absolute !important; z-index: 2 !important; ... } .rack { position: absolute !important; z-index: 3 !important; ... } .sticker { position: absolute !important; z-index: 4 !important; ... } 当元素由html代码分配时，它运行良好。
当我单击按钮将元素附加到canvas时，它无法正常工作。
即使矩形的z-index低于贴纸，新的矩形也会覆盖贴纸。
我认为这些的z-index如下所示
（上）新贴纸>新机架>新矩形>旧贴纸>旧机架>旧矩形（下）
我该如何解决这个错误。
请参考这个小提琴（ http://jsfiddle.net/crisply/bD35Z/9/ ）
将新元素追加到DOM时， z-index将返回0 。 我没有在其他浏览器上测试过这个，但它发生在Chrome中。
您必须在附加元素上手动设置z-index ，或者编写一些逻辑以自动为元素分配z-index值。
为了使用z-index proprety， 你必须将 css中 div的位置定义为： absolute，relative或fixed