父元素:position:fixed;
让子元素居中对齐:position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;
<style>
.loading{width:100%;height:100%;position:fixed;top:0;left:0;z-index:100;background:#fff;}
.loading .pic {width:50px;height:50px;background:url(images/loading.gif);position:absolute;top:0;bottom:0;left:0;right:0;margin:auto;}
</style> <div class="loading">
<div class="pic"></div>
</div>

在线css兼容性处理地址:autoprefixer.github.io

css遮罩层的更多相关文章

  1. div+css遮罩层

    曾被问到这个问题,不知所措,后来在网上找到了.大神文章:http://www.cnblogs.com/aspx-net/archive/2011/03/11/1981071.html 我想实现的效果没 ...

  2. CSS遮罩层的实现

    偶然发现自己原来写了一个CSS遮罩层,虽然这个东西没什么技术含量,但如果本人离开公司后又遇见此类问题,那么可能又得花些时间来找资料了.所以决定还是把它记下来吧. 直接上代码吧. 第一步,html代码: ...

  3. CSS 遮罩层、滑出页面

    <style> .panel_bak { position:fixed; bottom:0; display:none; width:100%; margin:0px; padding:5 ...

  4. CSS遮罩层简易写法

      现在很多站点弹出框,都需要一个遮罩层.写法很多,以下是我比较喜欢的一种: .box{ position:absolute; top:0; bottom:0; left:0; right:0; ba ...

  5. div+css 遮罩层

    CSS样式部分: ---------------------------------- <style type="text/css">#loading-mask{    ...

  6. CSS遮罩层,全兼容

    <script type="text/javascript"> $(function(){ $('#divLocker').css({ "position&q ...

  7. JS+CSS简单实现DIV遮罩层显示隐藏【转藏】

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. JS+CSS简单实现DIV遮罩层显示隐藏

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  9. jQuery遮罩层插件

    在网页上常常遇到须要等待非常久的操作,比方导出报表等.为了预防用户点击其它操作或者多次点击同个功能,须要用遮罩层把页面或者操作区盖住.防止用户进行下一步操作.同一时候能够提高界面友好度,让用户知道操作 ...

随机推荐

  1. Android学习笔记四:activity的四种启动模式

    Activity有四种启动模式:standard,singleTop,singleTask,singleInstance. 1.standard:标准启动模式 默认模式,这个模式下启动的Activit ...

  2. ES6学习笔记七:生成器与异步操作

    一:Generator Generator 函数是一个普通函数,但是有两个特征.一是,function关键字与函数名之间有一个星号:二是,函数体内部使用yield表达式,输出不同的内部状态. 执行 G ...

  3. SQL Server 2012 无人值守安装(加入新实例)

    方法1,通过指定条个參数安装 setup.exe /Q /IACCEPTSQLSERVERLICENSETERMS /ACTION=install /PID=<validpid> /FEA ...

  4. Echarts折线图点击事件

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

  5. python之模块datetime详解

    # -*- coding: utf-8 -*- #python 27 #xiaodeng #python之模块datetime详解 import datetime #data=datetime.dat ...

  6. RHEL6.5 grub修复测试

    RHEL6.5 grub修复测试 1.删除系统中的grub.conf配置文件,然后重启系统#rm -f /boot/grub/grub.conf#reboot 2.重启后,系统进入到grub界面:gr ...

  7. 在子线程中发送短信,静态注册SentMsgReceiver。

    1. 应该在子线程中执行发送短信的操作. 如果没有在子线程中发送短信会出现错误:点击发送短信之后,立即跳转到其他界面,那么这次发送短信可能就会失败! 请注意往子线程方法中传入外部的实参必须由final ...

  8. nginx常用超时设置

    客户度连接nginx超时, 建议5s内 接收客户端header超时, 默认60s, 如果60s内没有收到完整的http包头, 返回408 Syntax: client_header_timeout t ...

  9. Maven2和ivy比较

    Maven 2和Ivy常被放在一起对比,但实际上两者是不同类型的工具.Ivy仅提供依赖管理功能,但是Maven 2是一个软件项目管理综合工具,能够管理构建.报告.文档,以及根据中心化的信息来管理依赖. ...

  10. iOS 10 的一个重要更新-开发 iMessage 的第三方插件

    苹果官方的 Messages 在 iOS 10 推出了非常重大的更新,可能主要是想从其他 IM 巨头手里抢点市场份额回来,包括 Facebook Messenger, Wechat 和 Snapcha ...