单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中
单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中

<div class="ServicesLiTopPic">
<i></i>
<img class="YuYue1" src="data:images/ReserveServices/YuYue1.png" /> </div>
.ServicesLiTopPic i {
display:inline-block;
height:100%;
vertical-align:middle
}
.ServicesLiTopPic .YuYue1{display:inline-block;vertical-align:middle;}
单个未知大小图片在div里面垂直居中的方法。。。添加辅助元素挤一下位置达到居中的更多相关文章
- 尺寸不固定的图片在div中垂直居中并完全显示
前几天做一个项目,需要批量上传图片,图片外侧div尺寸固定:由于图片是用户输入的,所以大小存在不确定性,产品需求是无论图片尺寸多大,都要垂直居中完全显示 废话不多说,直接上代码 html <ul ...
- 未知高度的图片在div设置垂直居中
方法一: 该方法是将外部容器的显示模式设置成display:table,img标签外部再嵌套一个span标签,并设置span的显示模式为display:table-cell,这样就可以很方便的使用ve ...
- javascript的未知尺寸图片保持比例水平垂直居中函数
JavaScript的图片在容器内水平垂直居中的函数,利用图片加载获取图片大小,使之在父节点内水平垂直居中 展示方式有两种: 1.当参数keepImageFull为true:保持图片比例,使图片可完整 ...
- CSS-布局【1】-图片在div中垂直居中
方法一:通过增加100%高度行内块居中对齐 <!DOCTYPE html> <html> <head> <meta name="viewport&q ...
- 让图片在DIV中垂直居中
window.onload=function(){ var img = document.getElementById("imgdiv"); var div = document. ...
- DIV里面的图片水平与垂直居中的方法
<div class=“box”> <img /> </div> 1.水平居中: 1)box设置 text-align:center ; text-alig ...
- DIV或者DIV里面的图片水平与垂直居中的方法
<div class=“box”> <img /> </div> 水平居中的常用方式: text-align:center ——这可以实现子元素字体,图片的水平居中 ...
- css参考文档; 官方英文说明!! 1 margin padding 百分比参照物 2 margin值为auto时的说明 3 div在div里垂直居中方法 4 dispaly:flex说明
css参考文档 http://css.doyoe.com/ 两篇很好的文章:(下面的css官方英文说明链接 有时间可以研究下 http://www.w3.org/TR/css3-box/ ...
- css的div垂直居中的方法,百分比div垂直居中
前言 我们都知道,固定高宽的div在网页中垂直居中很简单,相信大家也很容易的写出来,但是不是固定高宽的div如何垂直居中呢?我们在网页布局,特别是手机等web端网页经常是不固定高宽的div,那么这些d ...
随机推荐
- A Complete Guide to the <Picture> Element
If you’ve ever struggled building responsive websites, this post is for you. It’s part of a series o ...
- 【SPOJ】10628. Count on a tree(lca+主席树+dfs序)
http://www.spoj.com/problems/COT/ (速度很快,排到了rank6) 这题让我明白了人生T_T 我知道我为什么那么sb了. 调试一早上都在想人生. 唉. 太弱. 太弱. ...
- 使用distinct出现的一个问题
如果指定了 SELECT DISTINCT,那么 ORDER BY 子句中的项就必须出现在选择列表中. 错误的写法:select distinct top 100 userphone from m ...
- ARC指南2 - ARC的开启和禁止
要想将非ARC的代码转换为ARC的代码,大概有2种方式: 1.使用Xcode的自动转换工具 2.手动设置某些文件支持ARC 一.Xcode的自动转换工具 Xcode带了一个自动转换工具,可以将旧的源代 ...
- 【C语言】13-指针和字符串
字符串回顾 一个字符串由一个或多个字符组成,因此我们可以用字符数组来存放字符串,不过在数组的尾部要加上一个空字符'\0'. char s[] = "李洪强"; 上面的代码定义了一个 ...
- lintcode :Coins in Line II 硬币排成线 II
题目 硬币排成线 II 有 n 个不同价值的硬币排成一条线.两个参赛者轮流从左边依次拿走 1 或 2 个硬币,直到没有硬币为止.计算两个人分别拿到的硬币总价值,价值高的人获胜. 请判定 第一个玩家 是 ...
- 使用Qt 开发图形界面的软件
3DSlicer, a free open source software for visualization and medical image computing AcetoneISO:镜像文件挂 ...
- 通过console口连接交换机
最近发现有人不会通过console口连接交换机. 想想当初我还是小白的时候也是如此啊,如是写下教程. 虽然略简单... 1.连线: console线:(Console---usb) 2.安装驱动 (可 ...
- 关于纯css布局的概况
用一些常用的手法来表现感情或者论证问题,这在XHTML中就是用特定的元素来完成一些常见的信息组织.下面就是信息组织形式与元素的对应列表. img 作为内容的图片是一定要放到img里面的,这没有更好的选 ...
- mongodb复制集配置
#more /opt/mongodb3.0/mongodb_im_conf_47020/mongodb3.0_im_47020.cnf dbpath = /opt/mongodb3.0/mongodb ...