CodeSky 代码之空

随手记录自己的学习过程

CSS 优雅的在table中居中div

2015-12-27 19:39分类: CSS评论: 0

在周五的时候,某同学给我发了一个网页,大致想知道这是怎么实现的。

网址在这里:http://dota2.gamepedia.com/Dota_2_Wiki

首先思考了一下,第一,是居中,居中我们使用的text-align: center,说真的,这个刚开始我还犹豫了一下,不过发现确实是通过这个实现的。

但是在最后一行两格的情况,会发生最后一行居中而不是这个效果,那么接下来这个效果是怎么做的呢。

它是通过n个计算好长度的div来实现的。该div的width和其他一样而height为0,这样就能实现这种效果了,而n的值应该也是计算好的,或者多加也无所谓,总之是个很微妙的实现方式,也算挺有趣。

具体的demo,有空再来,诸位看官现在可以在此网站右键审查元素。

评论 (0)