直接上代码了

<div class="showpic">
<span></span>
<img src="" alt="">
</div>

样式

.showpic {
font-size: 0;
position: fixed;
top: 0;
width: 100%;
height: 100%;
left: 0;
background: #4d4d4d;
z-index: 999;
text-align: center;
display: none;
}
.showpic span {
height: 100%;
display: inline-block;
vertical-align: middle;
}
.showpic img {
vertical-align: middle;
max-height: 100%;
z-index: 999;
max-width: 100%;
display: inline-block;
}

css让图片居中显示在手机屏幕上的更多相关文章

  1. css设置图片居中、居左、居右

      CreateTime--2017年12月8日14:25:09 Author:Marydon css设置图片居中.居左.居右 图片一般默认是居左显示的,如何更改它的水平位置呢? <div st ...

  2. css图片居中,通过纯css实现图片居中的多种实现方法

    在网页布局中,图文排版是我们常用的,那么经常会遇到如何让图片居中显示呢,这篇文章将总结常用css实现图片居中的方法总结: html结构: <div class="demo" ...

  3. Droid@screen:在PC屏幕上显示Android手机屏幕

    这里介绍一款工具——Droid@screen,用来获取手机屏幕,显示在PC屏幕上.它集截图.录像等多种功能于一体. 安装 1.    下载地址:http://droid-at-screen.org/d ...

  4. vue打包后js和css、图片不显示,引用的字体找不到问题

    vue打包后js和css.图片不显示,引用的字体找不到问题:图片一般都是背景图片. 一.vue打包出现js和css不显示问题: 1.不使用mode:'history' 2.使用mode:'histor ...

  5. css 字体上下居中显示 解决安卓手机line-height的偏差

      1.字体左右居中显示 text-align: center   <div class="font"> 上下居中 </div> .font{ width: ...

  6. CSS基础之居中显示

    这些天忙完了一些项目后,终于有时间来总结一下了.自己就把做项目过程中的体会和理解到的一些东西和大家分享一下.有错请指正!! 在css中,元素居中显示,是基础也是一个小难点.我们经常不知为何总是不能把元 ...

  7. extjs中grid中行内文本或图片居中显示

    我是看了网上写的方法调试自己的代码来实现的,实现的方式是当加载store数据时改变grid的行样式,源码如下: html代码: <div id="weatherP_grid-body& ...

  8. CSS设置图片居中的方法

    如果是应用了表格,那么设置单元格为align="center"就可以使其中的一切内容居中.如果没有应用表格要想设置图片居中就有点困难了.困难来自不按"常规出牌" ...

  9. HTML+Css让网页自动适应电脑手机屏幕

    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scal ...

随机推荐

  1. 在ubuntu 12.04 中配置java环境(安装jdk, tomcat, maven, eclipse)

    1. 安装jdk 1.7 在ubuntu( /usr/lib/jvm/java-7-openjdk-amd64 )中默认有安装jdk 1.7 如果没有 可下载 : http://www.oracle. ...

  2. 基于cygwin构建u-boot(四)libgcc引用

    接上文,config.mk文件修改后,即使没有.depend也可以正常处理了: 六.错误:gcclib引用错误 完成之前几篇的工作后,程序就可以一直执行了,直到最后生成u-boot, 出现如下错误告警 ...

  3. vi 编辑器初步

    vi 编辑器初步 4,vi进入后是命令模式 ,可以用i o s 进入插入模式 i ,在当前字符位置插入,o为新开一行插入,s删除当前字符添加 5,r 为直接替换当前字符 6,到行头按0,$为到行尾到未 ...

  4. OC与Swift混编

    群里大神发的网址,感觉有用就先收录了,暂时没时间看SWIFT,感觉代码简洁,但是可阅读性不是太高,有些代码让系统去判断类型,同样的,我们看代码的时候也得自己去判断类型,或许看多就习惯了,有时间再说吧, ...

  5. JVM virtual memory

    This has been a long-standing complaint with Java, but it's largely meaningless, and usually based o ...

  6. SALT-API兼HALITE测试搞定

    妈XX,真的搞了近一周的空闲时间. 最后才领悟. 其实,先按HALITE的套路弄好,然后直接SALT-API就OK了..因为HALITE就是SALT-API的封闭和替代嘛. 随便参考一个URL搞定HA ...

  7. BZOJ 3550 Vacation

    http://www.lydsy.com/JudgeOnline/problem.php?id=3550 题意:有3N个数,你需要选出一些数,首先保证任意长度为N的区间中选出的数的个数<=K个, ...

  8. 查看mysql字符集及修改表结构--表字符集,字段字符集

    MySQL 乱码的根源是的 MySQL 字符集设置不当的问题,本文汇总了有关查看 MySQL 字符集的命令.包括查看 MySQL 数据库服务器字符集.查看 MySQL 数据库字符集,以及数据表和字段的 ...

  9. Roman numerals

    Roman numerals 罗马数字的题目, 注意几个关键的数字即可: (100, 400, 500, 900) -> ('C', 'CD', 'D', 'CM'); (10, 40, 50, ...

  10. 关于导入oracle10g的数据到sqlserver2005里的方案总结

    由于项目需求,现需要将oracle的数据全部导入到sqlserver中,一下算是自己的总结小计吧. sqlserver有自己的导入数据的功能,其中就有提供两种方式从oracle导入数据. 两种方式就不 ...