css 水平垂直居中
主要是垂直居中有点麻烦,以下代码可以实现,先记下来:
<style type="text/css">
div{ border:1px solid #ccc; height:500px; width:500px; text-align:center; margin:0 auto; background:#ccc;}
img{ vertical-align:middle; }
div span{ height:100%; width:0; overflow:hidden; display:inline-block; vertical-align:middle; }
</style>
<div class="test">
<img src="icon.png"><span> </span>
</div>
css 水平垂直居中的更多相关文章
- CSS水平垂直居中总结
行内元素水平居中 把行内元素包裹在块级父元素中,且父元素中的css设置text-align:center; <!DOCTYPE html> <html> <head> ...
- css水平垂直居中对齐方式
1.文字或者内联元素的垂直水平居中对齐 css属性 -- 水平居中:text-aligin:center; 垂直居中: line-height:height; 例子:. html: <div c ...
- 把简单做好也不简单-css水平垂直居中
44年前我们把人送上月球,但在CSS中我们仍然不能很好实现水平垂直居中. 作者:Icarus 原文链接:http://xdlrt.github.io/2016/12/15/2016-12-15 水平垂 ...
- CSS水平垂直居中的方法
原文链接:http://caibaojian.com/370.html 水平垂直居中,特别是使用在列表的时候经常会用到的,以前有需求的时候我也做过类似的代码,是使用display:table-cell ...
- css 水平垂直居中总结
空闲总结了下水平垂直居中方案,欢迎补充: 水平居中 水平居中有两种情况: 子元素是内联元素 这种那个情况下只需要在父元素定义: text-align:center; 例子: html: //省略了bo ...
- CSS水平垂直居中的几种方法2
直接进入主题! 一.脱离文档流元素的居中 方法一:margin:auto法 CSS代码: div{ width: 400px; height: 400px; position: relative; b ...
- CSS水平垂直居中的几种方法
直接进入主题! 一.脱离文档流元素的居中 方法一:margin:auto法 CSS代码: div{ width: 400px; height: 400px; position: relative; b ...
- 常见的几种 CSS 水平垂直居中解决办法
用CSS实现元素的水平居中,比较简单,可以设置text-align center,或者设置 margin-left:auto; margin-right:auto 之类的即可. 主要麻烦的地方还是在垂 ...
- 介绍一种css水平垂直居中的方法(非常好用!)
这次介绍一下一个水平垂直居中的css方法,这个方法可以说是百试百灵,废话不多说,直接附上代码: html,body{ width:100%; height:100%; } 你需要居中的元素{ posi ...
- css水平垂直居中
margin法(水平居中) 需要满足三个条件: 元素定宽 元素为块级元素或行内元素设置display:block 元素的margin-left和margin-right都必须设置为auto 三个条件缺 ...
随机推荐
- iOS开发中获取WiFi相关信息
iOS 开发中难免会遇到很多与网络方面的判断,这里做个汇总,大多可能是与WiFi相关的. 1.Ping域名.Ping某IP 有 时候可能会遇到ping 某个域名或者ip通不通,再做下一步操作.这里的p ...
- javaScript中值类型通过typeof直接进行检测
通过试验,对图像处理有了进一步深入了解和认知,基于第一次的滤波的处理和这次灰度线性变换和直方图处理图像,知道了图像的成像原理,都是一个个的像素点,就是矩阵的值.以后可以利用MATLAB进行图像处理,运 ...
- 关于datarow的状态
发现没有添加到DataTable中的行删除则为Detached,添加之后则为Deleted.MSDN对RowState的说明 Detached 该行已被创建,但不属于任何 DataRowCollect ...
- QHash
#include <QCoreApplication> #include<QHash> #include<QDebug> int main(int argc, ch ...
- js 转码 和 .Net 后台解码
为防止 中文乱码,js传值要转码,当js 用 escape() 转码时,.Net 后台可以用 HttpUtility.UrlDecode() 进行解码. 例如: document.cookie = ...
- uploadify使用教程
<div> <input type="file" id="uploadify" name="uploadify" /> ...
- 日志监控系统中,大批量查询mysql方案
最近开发遇到一个问题:需要查询一个大时间段内的数据,分1000个小段,即为1000个点.X轴是时间,Y轴是该小时间段内统计后数据.注意:数据返回是一个list,其中每个对象返回值都是该小时间段内数据统 ...
- Peter Norvig:自学编程,十年磨一剑
若要在某一领域内达到专家级的水平,其关键在于"审慎地重复",也就是说,并非是机械地,一遍又一遍地练习,而是要不断地挑战自我,试图超越自身当前的水平,通过不断的尝试挑战,并在尝试的过 ...
- Android Studio: Failed to sync Gradle project 'xxx' Error:Unable to start the daemon process: could not reserve enough space for object heap.
创建项目的时候报错: Failed to sync Gradle project 'xxx' Error:Unable to start the daemon process: could not r ...
- Virtualbox虚拟机配置CentOS7.0静态网络
1.首先在Virtualbox下将网络设置为Bridged Adapter,此项设置可以使本机与虚拟机进行互访,而NAT模式只能进行单项访问: 2.先切换到root,配置网卡信息需要用到root,然后 ...