行高设置成了和元素高度一样不能垂直居中？
问题：行高设置成了和元素高度一样50px，为什么英文部分(Cascading Style Sheets)还不能垂直居中啊？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>文本样式</title>
<style type="text/css">
div{
/*display:table;*/
width:100%;
}
p{
/*display:table-cell;*/
text-align:center;
height:50px;
}
.english{
line-height:50px;
/*vertical-align:middle;*/
}
</style>
</head>
<body>
<div>
<p>
<img src="http://img1.sycdn.imooc.com/climg//59c21bae000157fa01000059.jpg" alt="css3">
<span class="chinese">CSS层叠样式表</span>
<span class="english">(Cascading Style Sheets)</span>
</p>
</div>
</body>
</html>13
收起
正在回答
2回答
同学你好，你是想实现图片与文字都垂直居中吧，比如下面这样的效果：
如果是这样的话，需要如下设置：
之前的答案，只是给你讲了为什么“英文部分”（单独这部分）文字没有垂直居中。
同学可以再试一下。
祝学习愉快！
相似问题
登录后可查看更多问答，登录/注册
恭喜解决一个难题，获得1积分~
来为老师/同学的回答评分吧
0 星