直接上代码了

<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. JDBC框架

    一.元数据介绍 元数据指的是"数据库"."表"."列"的定义信息. 1.1.DataBaseMetaData元数据 Connection.g ...

  2. Destoon标签使用技巧十则

    Destoon标签 1.全局标签 网站名称:{$DT[sitename]}网站地址:{DT_PATH}网站LOGO: {if $MODULE[$moduleid][logo]}{DT_SKIN}ima ...

  3. ASP.NET学习笔记——ASP.NET应用程序

    0 剖析ASP.NET应用程序 用户运行ASP.NET应用程序,不是直接运行,而是使用浏览器(比如IE)通过HTTP请求一个特定的URL(如http://www.mysite.com/mypage.a ...

  4. HDU 4276 The Ghost Blows Light(树形)

    题意:给出一棵n个节点的树,起点1,终点n,相连的两个节点之间有距离,每个节点有个价值,给出一个时间T.问从1到达n在给定时间T内取得的最大价值? 思路:先从1走到n,如果总的时间不够走完,直接退出, ...

  5. 网络版shell之网络编程练习篇--telnet服务端

    网络版shell之网络编程练习篇--telnet服务端   以前写过一个shell命令解释器,对与shell命令解释器的执行流程有了清晰的认识,这段时间学习网络编程,至于网络编程的细节以及知识点,已经 ...

  6. 2015第16周六学习java建议

    学习Java 建议: 尽量用 google 查找技术资料. 有问题在 stackoverflow 找找,大部分都已经有人回答. 多看官方的技术文档. ibm developerworkers 的文章质 ...

  7. Check whether a given Binary Tree is Complete or not 解答

    Question A complete binary tree is a binary tree in which every level, except possibly the last, is ...

  8. 简述tcp协议对http性能的影响及优化

    当网站服务器并发连接达到一定程度时,你可能需要考虑服务器系统中tcp协议设置对http服务器的影响. tcp相关延时主要包括: 1.tcp连接时建立握手: 2.tcp慢启动拥塞控制: 3.数据聚集的N ...

  9. 恢复Linux下被误删除的文件(笔记)

    恢复Linux下被误删除的文件 [root@xuegod63 ~]# mount /dev/cdrom /mnt/ 分一个区:sda4  查找:extundelete 分一个区:sda4  [root ...

  10. iOS面试知识点

    1 iOS基础 1.1 父类实现深拷贝时,子类如何实现深度拷贝.父类没有实现深拷贝时,子类如何实现深度拷贝. 深拷贝同浅拷贝的区别:浅拷贝是指针拷贝,对一个对象进行浅拷贝,相当于对指向对象的指针进行复 ...