怎么将下面的代码中的文字设置成为垂直居中，就用css样式，不用表格，不用定位，有没有，求教？？？

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>定宽块状元素水平居中</title>
<style>
.p1{background-color:#09C;height:500px;vertical-align:middle;}
.p2{
	display:inline-block;
	background-color:#666;
}
</style>
</head>

<body>
<div class="p1">
  <div class="p2"><span>垂直居中垂直居中垂直居中垂直居中垂直居中 </span></div>
</div>
</body>
</html>

45632346

浏览 1519回答 2

2回答

橋本奈奈未

设置元素的line-height为你的height值，height可省略；如果你span元素没什么特殊作用可去除

Yexiaomo

文字垂直居中, 把放置文字容器的 height 和 line-height 设成一样就行了height:25px; line-height:25px;像你上面的,这样就行了.p2{ display:inline-block; background-color:#666; height: 500px; line-height: 500px; }

随时随地看视频慕课网APP