html 结构

<div class="container">
<div class="content"></div>
</div>

css

.container{
width: 100%;
height: 100%;
text-align:center;
position: fixed;
}
.container:after {
display: inline-block;
content: '';
width:;
height: 100%;
vertical-align: middle;
}
.content{
width: 100px;
height: 100px;
display: inline-block;
vertical-align: middle;
background: blue;
}

纯css 图片自适应居中的更多相关文章

  1. 演示:纯CSS实现自适应布局表格

    <!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...

  2. div等比例缩放-------纯CSS实现自适应浏览器宽度的正方形

    摘自:https://blog.csdn.net/u010513603/article/details/78200207 1.方案一:CSS3 vw 单位 CSS3 中新增了一组相对于可视区域百分比的 ...

  3. 纯CSS图片缩放后显示详细信息

    哎~!突然好久没更新博客了,最近总在下雨,晚上也经常没有时间来管理博客(目前在敲自己的一个平台,晢时还在写逻辑层的代码),好吧!废话不多说了,言归正传. 现在很多图片缩放的特效大多数都是用javasc ...

  4. CSS 图片自适应容器

    https://www.jb51.net/css/660677.html 经常有这样一个场景,需要让图片自适应容器的大小. 1.img标签的方式 我们马上就能想到,把width.height 设置为1 ...

  5. css 图片文字居中

    1.单行文字居中 2.多行文字居中 3.利用background-position:center;的图片居中 4.利用display:table-cell;属性的图片居中 <!DOCTYPE h ...

  6. 前端纯css 图片的模糊处理

    最近做的一个项目需要用到背景图的模糊处理,在网上查资料,发现用css的 filter 属性就可以解决,但是因为模糊度比较高,四周会有很长的模糊边,百度上也没找到解决的方法,,可喜的是最后我在分析一个d ...

  7. Css 图片自适应

    设置 CSS .container{ overflow:auto; } img{ width:100%; height:auto; overflow:hidden; } 设置 template < ...

  8. html5+css 图片自适应

    <div style="position:absolute; width:100%; height:100%; z-index:-1; left:0; top:0;"> ...

  9. 原创jQuery插件之图片自适应

    效果图例如以下: 功能:使图片自适应居中位于容器内 限制:容器须要给定大小 用法: 1.引入jQuery.然后引入fitimg插件 2.给须要图片自适应的容器固定宽高 3.header .accoun ...

随机推荐

  1. CSDN站点系统升级公告

    各位尊敬的CSDN用户: 你们好. CSDN站点将于2015年12月17日23时-12月18日08时进行系统升级维护,升级维护期间,CSDN站点将会受到影响.可能会导致博客.下载频道及站点其它功能无法 ...

  2. 深度探究apk安装过程

    一.先验知识 0.PcakageaManagerService版本号变化 1.概述 2.PackageManagerService服务启动流程 3. PackageManagerService入口 二 ...

  3. 没有IP地址的主机怎样保持IP层联通

    在<两台不同网段的PC直连能否够相互ping通>一文中,我有点像在玩旁门左道,本文中.我继续走火入魔.两台机器,M1和M2,各自有一个网卡eth0,配置例如以下:M1的配置:eth0上不配 ...

  4. 实现TextView中link的点击效果

    朋友们,你们在TextView处理link的时候是不是一直被苦逼的android默认的方式困扰?每次点击link的时候,点击效果是整个textview来响应.非常烂吧?原因就不多赘述了. 那么以下这个 ...

  5. python(14)- 简单练习:登录账户失败三次,账户自动锁定

    题目需求:   1.输入用户名密码   2.认证成功后显示欢迎信息   3.输错三次后锁定 #读取注册用户的信息,用户名,密码,输错次数,写入字典中 user={} with open("D ...

  6. mysql 中alter语句中change跟modify的区别

    mysql 中alter语句中change和modify的区别可以使用CHANGE old_col_name column_definition子句对列进行重命名.重命名时,需给定旧的和新的列名称和列 ...

  7. switch中的case不加break执行情况

    输出结果:230 分析,switch先匹配一个case满足$a,然后执行case里面的语句,直到遇到break,否则一直往下执行 <?php $a = ; switch($a){ : echo ...

  8. 使用git checkout 指定git代码库上的指定分支

    因为曾经一直是在用svn,到狼厂,大家都用Git. 哥的开发环境:IntelliJ 说说简单的操作过程吧. 1.检出Git代码库 cd到指定文件夹 git clone http://..../andr ...

  9. 在Windows平台用visual studio编译的可执行文件部署时报:应用程序无法正常启动0xc000007b(跟DirectX9无关的原因)

    最近在做EasyDarwin开源流媒体服务器Windows版本编译与部署时发现一个问题,在开发机本机运行都很正常,但是部署到目标机器(未安装vs等开发环境)时,莫名其妙报出了"应用程序无法正 ...

  10. wcf服务发布时,目录中没有文件生成

    1.删除原有的配置文件