小技巧小经验之-----居中

原创 2016年08月29日 14:10:52
/*图片居中*/
<dl>
    <dt><img src=""/><span></span></dt>
    <dd></dd>
</dl>

dt{height:100px;width:100px;text-align:center;}
dt span{ width:0;height:50%;display:inline-block;}
dt img{vertical-align:middle;}
/*span为参照物,只有inline-block类型可以用vertical-align这个属性*/
/*法二:*/
dt{height:100px;width:100px;text-align:center;}
dt span{width:0;height:100px;display:inline-block;vertical-align:middle;}
dt img{vertical-align:middle;}


/*盒子居中*/
html:
<div class="fu">
    <div class="zi"></div>
</div>
css:/*法一*/
.fu{height:500px;width:400px;background:red; position:relative;}
.zi{height:100px;width:100px;background:blue;
        psition:absolute;left:50%;top:50%;margin:-50px 0 0 50px;}
/*法二*/
.fu{height:500px;width:400px;background:red; position:relative;}
.zi{height:100px;width:100px;background:blue;
        position:absolute;left:0;right:0;top:0;bottom:0;margin:auto;}/zi盒子的宽高可以自定义无论多少他都会居中z(自适应居中)/

版权声明:本文为博主原创文章,未经博主允许不得转载。本文主要为编者读书笔记,在文章里面很多话是掺杂了编者自己的见解,如果有哪里出现错误或者用词不严谨,请友善留言,编者会及时去更改。

相关文章推荐

小技巧、小经验

1、支持ActiveX,调整IE浏览器安全级别 REM ActiveX的注册表项 REM 值 设置 REM ------------------------------ REM 0...

小技巧、小经验(3)

1、多态作用: 多态的意义在于,它实现了接口重用(同一的表达式),接口重用带来的好处是程序更易于扩展,代码重用更加方便,更具有灵活性,也就能真实地反映现实世界。

qgy 的ios 一些小经验,小技巧

1、 针对UIScrollView 如何做自动布局?UITableView常用。等等

一些小知识小经验(使用java或者c语言实现的socket服务器的优化技巧)

CPU使用率总是100%怎么办? 为什么socket客户端在非正常断开后,服务器在很长一段时间内不会显示客户端断开?(或:为什么保持长连接需要“心跳包”?) 什么是阻塞式IO,什么是非阻塞式IO?区分...

HTML居中的三个小技巧

一:当图片(img元素)远远大于父元素时,如何让图片居中显示呢? 1.1方法 图片的父元素设置text-align:center. 图片(img元素)设置margin:0 -100%;和高度; 1....

小博老师经验分享 ——参加编程大赛的小技巧

[引言] 听说博为峰编程大赛要开始啦!!!各位同学是否已经跃跃欲试准备报名了呢?据说奖励非常的丰厚哦!小博老师听到这个消息也是异常兴奋,奈何俗(mei)务(you)缠(zi)身(ge),只能在这里给...

iPhone4 的67条使用小经验

  • 2013-05-20 13:53
  • 172KB
  • 下载

maximo小经验

内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:深度学习:神经网络中的前向传播和反向传播算法推导
举报原因:
原因补充:

(最多只允许输入30个字)