文本垂直居中代码是什么?
时间: 2023-05-16 13:06:35 浏览: 60
可以使用CSS的flexbox布局来实现文本垂直居中,代码如下:
.container {
display: flex;
align-items: center; /* 垂直居中 */
justify-content: center; /* 水平居中 */
}
其中,.container是包含文本的容器元素,align-items属性用于垂直居中,justify-content属性用于水平居中。
相关问题
在HTML中文本垂直居中代码是什么?
可以使用CSS的属性来实现文本垂直居中,代码如下:
```
display: flex;
align-items: center;
justify-content: center;
```
这将使文本在其容器中垂直居中。
input文本垂直居中
要实现文本垂直居中,可以使用CSS的flex布局。具体实现方法如下:
HTML代码:
```
<div class="container">
<div class="content">
<p>这是要垂直居中的文本</p>
</div>
</div>
```
CSS代码:
```
.container {
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.content {
text-align: center;
}
```
其中,`.container`是外层容器,使用`display: flex`将其设置为flex布局。`justify-content: center`和`align-items: center`分别将子元素水平和垂直居中。`.content`是内层容器,使用`text-align: center`将文本水平居中。