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

原创 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(自适应居中)/

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

30 个java编程技巧(最佳实践的初学者)

1.return 一个空的集合,而不是 null 如果一个程序返回一个没有任何值的集合,请确保一个空集合返回,而不是空元素。这样你就不用去写一大堆 ”if else” 判断null元素。 ...
  • zyf__java
  • zyf__java
  • 2016年09月05日 08:23
  • 6145

HTML小技巧的一些小技巧

1.怎样定义网页语言(字符集)?             在制作网页过程中,你首先要定义网页语言,以便访问者浏览器自动设置语言,而我们用所见即所得的HTML工具时,都没有注意到这个问题,因为它是默认...
  • shipeng22022
  • shipeng22022
  • 2015年07月16日 13:11
  • 2916

Eclipse使用心得与技巧

Eclipse使用心得与技巧:常用快捷键(熟练使用快捷键可以充分提高编程效率,吐血整理...),护眼背景色,为代码添加统一注释,中英文切换...
  • diyangxia
  • diyangxia
  • 2015年01月13日 15:40
  • 11465

小技巧、小经验

1、支持ActiveX,调整IE浏览器安全级别 REM ActiveX的注册表项 REM 值 设置 REM ------------------------------ REM 0...
  • brk1985
  • brk1985
  • 2015年07月22日 18:06
  • 594

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

1、 针对UIScrollView 如何做自动布局?UITableView常用。等等
  • u010916821
  • u010916821
  • 2014年12月18日 22:40
  • 1111

小技巧、小经验(3)

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

精彩编程与编程技巧-VB开发CAI软件的小经验...

  • 2009年10月10日 17:32
  • 2KB
  • 下载

精彩编程与编程技巧-用VB开发CAI软件的小经验...

  • 2009年10月10日 19:43
  • 2KB
  • 下载

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

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

HTML居中的三个小技巧

一:当图片(img元素)远远大于父元素时,如何让图片居中显示呢? 1.1方法 图片的父元素设置text-align:center. 图片(img元素)设置margin:0 -100%;和高度; 1....
  • a895865025
  • a895865025
  • 2017年03月13日 09:09
  • 152
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:小技巧小经验之-----居中
举报原因:
原因补充:

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