Question

Css div 悬浮层 居中显示，一个div 在另一个div 上悬浮，并且居中

想做一个数据加载时，等待的效果：如图，我的代码如下！望各位大侠指教

.test { width: 200px; height: 200px; margin: 100px; border: 10px solid #f00; }
.test-loading-img { background: url(Css/Themes/Default/Images/ajax-loader.gif) no-repeat; /*top: 0px; left: 0px; right: 0px; bottom: 0px;*/ margin: 0px; width: inherit; height: inherit; position: fixed; background-position-x: 50%; background-position-y: 50%; background-color: #000; opacity: 0.6; }
<div id="dd" class="test"> <div>数据内容省略</div>
<div class="test-loading-img"></div>
</div>

Answer 1

1. 在.text样式里添加一个：position: relative;

2. 把.test-loading-img样式里的top,left,right,bottom四个注释取消掉，把 position:fixed;改成position: absolute;

3. 完成