CreateTime--2017年8月23日09:08:13
Author:Marydon

CSS部分

/*加载样式*/
.Loading {
    position: absolute;
    left: 43%;
    top: 35%;
    width: 140px;
    height: 50px;
    text-align: center;
    background: #FAFAFF url(images/loading.gif) no-repeat 10px center;
    z-index: 99999;
    border: solid 1px #a9a9a9;
}
/*加载展示文本样式*/
.LoadingText {
    position: absolute;
    top: 20px;
    left: 40px;
    bottom: 5px;
    text-aligh: center;
    width: 80px;
}

 

所需图片

数据加载样式_HTML

HTML部分

<div class="Loading" id="PageLoading" style="display: none;"><div class="LoadingText" id="schedule">正在加载中...</div></div>

效果展示：

数据加载样式_加载_02

　　

通过js来控制这个div显示的时机及提示内容，见文章

 

 

作者：​​Marydon​​