首页 课程 师资 教程 报名

在CSS中div文字垂直居中对齐

  • 2022-12-28 10:25:14
  • 624次 星辉

使用 CSS vertical-align 属性将文本垂直居中对齐

要使文本垂直居中对齐,您可以使用 CSS 属性vertical-alignwithcenter作为其值。您还需要使用display:table-cellCSS 属性使文本垂直居中。

向 div 元素添加一些宽度和高度,并将文本也水平居中对齐。要使文本水平居中,您必须使用text-align:center.

<style>
.valigndiv{
	width:200px;
  	height:200px;
  	display:table-cell;
  	text-align:center;
  	background:#ccc;
  	border:1px solid #000;
  	vertical-align:middle;
}
</style>
<div class="valigndiv">This is the Vertically Aligned content.</div>

输出

上面的示例包含带有一些背景颜色的 div 元素。div 元素中的文本位于所需位置。

选你想看

你适合学Java吗?4大专业测评方法

代码逻辑 吸收能力 技术学习能力 综合素质

先测评确定适合在学习

在线申请免费测试名额
价值1998元实验班免费学
姓名
手机
提交