小编Ole*_*kyi的帖子

在另一个div下面堆叠div的一角

我试图把蓝色方格div的角落放在橙色div下面.我尝试了所有我知道的东西: z-index不起作用,因为我的div被包裹在另一个div中,如果我打开它,我会遇到定位八个元素的麻烦.

谁能告诉我怎么做?或者如何对所有元素使用z-index?

是)我有的:

一

我需要的:

二

到目前为止我的HTML:

 body {
   background-color: #222;
   background-repeat: no-repeat;
 }
 #blueSquare {
   position: absolute;
   left: 15px;
   top: 15px;
   width: 50%;
   height: 170px;
   -webkit-transform: rotate(-45deg);
 }
 #rightTopblueSquare {
   height: 100%;
   width: 50%;
   position: relative;
   left: 50%;
   background-color: #7ab9c2;
   opacity: .99;
 }
 #leftBottomblueSquare {
   position: relative;
   top: -100%;
   height: 100%;
   width: 50%;
   background-color: #6baaae;
 }
 /*----------------------------------*/
 #greySquare {
   width: 50%;
   height: 170px;
   position: absolute;
   bottom: 15px;
   left: 15px;
   -webkit-transform: rotate(45deg);
 }
 #lefTopgreySquare {
   height: 100%;
   width: 50%;
   position: …
Run Code Online (Sandbox Code Playgroud)

html css z-index

8
推荐指数
1
解决办法
227
查看次数

标签 统计

css ×1

html ×1

z-index ×1