在CSS中,设置字体在块中的位置居中是一个常见的需求。下面我们就来介绍如何实现这个功能。/* 使用text-align属性实现水平居中 */ div { text-align: center; } p
在CSS中,设置字体在块中的位置居中是一个常见的需求。下面我们就来介绍如何实现这个功能。
/* 使用text-align属性实现水平居中 */ div { text-align: center; } p { display: inline-block;/*或者将块级元素改为行内块级元素*/ } /* 使用line-height属性实现垂直居中 */ div { line-height: 100px;/*设置line-height为容器高度*/ text-align: center;/*水平居中*/ } p { display: inline-block;/*或者将块级元素改为行内块级元素*/ vertical-align: middle;/*设置垂直对齐方式为居中*/ }
通过上面的代码,我们可以发现,实现块内字体的居中并不难。我们可以分别通过text-align和line-height两个CSS属性实现水平和垂直两个方向的居中。
粉丝
0
关注
0
收藏
0