在表格布局时代,不需要过多的考虑垂直居中的问题,在单元格中,默认就是垂直居中的,一行文字是垂直居中,三行文字同样也会垂直居中。进行CSS网页布局,这样的形式改变了。文字默认是居于容器顶部。
如下所示:
在这样的情况下,如何实现文字垂直居中呢。分为三种情况:
一、如果是单行文本,可以用行距来解决问题。
我们为它增加行距的定义,得到单行文本垂直居中的效果。
二、如果是多行文本,父容器不固定高度。
我们可以用padding来解决问题。
设置容器的padding上下为相同的固定值,容器的高度随着内容的增加而增加。
以此来实现多行文本的垂直居中。
我们致力于为中文网站提供动力! |