在写页面的时候,经常会遇到元素垂直居中的需求。有时候一连试了几种方法,并没有效果,那是因为你没有用对方法,每种垂直居中,都有不同的使用条件。下面我们来详细了解一下吧。
这里收集了八种不同的方法。
一、行高,line-height。
适用场景:单行文字垂直居中。
在一个块级元素中有一行字,想让文字垂直居中,便可以在块级元素上设置和元素高度一致的行高。如图所示
在写页面的时候,经常会遇到元素垂直居中的需求。有时候一连试了几种方法,并没有效果,那是因为你没有用对方法,每种垂直居中,都有不同的使用条件。下面我们来详细了解一下吧。
这里收集了八种不同的方法。
适用场景:单行文字垂直居中。
在一个块级元素中有一行字,想让文字垂直居中,便可以在块级元素上设置和元素高度一致的行高。如图所示