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. ios 清理缓存(EGO)

    一段清理缓存的代码例如以下: dispatch_async( dispatch_get_global_queue(DISPATCH_QUEUE_PRIORITY_DEFAULT,) , ^{ NSSt ...

  2. 机器学习(Machine Learning)&amp;深度学习(Deep Learning)资料

    机器学习(Machine Learning)&深度学习(Deep Learning)资料 機器學習.深度學習方面不錯的資料,轉載. 原作:https://github.com/ty4z2008 ...

  3. 我的vim插件列表

    一.正在使用的插件 1. NERD tree   文件浏览 2. bufexplorer  buffer 浏览 3. mru.vim   最近使用的文件浏览 4. ctrlp.vim  文件模糊搜索, ...

  4. SpringSecurity学习笔记(一):搭建最简单的SpringSecurity应用

    学习过程参考自:http://www.mossle.com/docs/auth/html/pt01-quickstart.html 一.搭建Maven项目: 所需引用的jar包如下: pom.xml文 ...

  5. hbase shell删除没实用

    用Xshell登陆linux主机后,在hbase shell下不能使用backspace和delete删除误输的指令,这是Xshell的配置问题: 在File->Properties->T ...

  6. C# - Garbage Collection

     The .NET Framework's garbage collector manages the allocation and release of memory for your appl ...

  7. 基于chyh1990/caffe-compact在windows vs2013上编译caffe步骤

    1.      从https://github.com/chyh1990/caffe-compact下载caffe-compact代码: 2.      通过CMake(cmake-gui)生成vs2 ...

  8. aop学习总结三----aop的相关概念

    aop学习总结三----aop的相关概念 public Object invoke(Object proxy, Method method, Object[] args) throws Throwab ...

  9. Delphi里可将纯虚类实例化,还可调用非虚函数

    这是与Java/C++的巨大不同.目前还没仔细想这个特征与TClass之间的联系,先记住结论再说.以后再回来修改这个帖子. unit Unit1; interface uses Windows, Me ...

  10. 有关 java 不定参数

    不定参数实际为数组参数的一种写法而已,本质上与数组参数完全相同 //1.数组参数函数 public static int sum(int[] values) { } //2.不定参数函数 不定参数只能 ...