请问img为什么没有垂直居中?要它垂直居中应怎样实现?

请问img为什么没有垂直居中?要它垂直居中应怎样实现?

<!DOCTYPE html>

<html>

<head>

<title>a</title>

<meta charset="utf-8">

<style type="text/css">

.logo{

width: 600px;

height: 600px;

background-color: #ccc;

text-align: center;

line-height: 600px;

}

img{

width: 200px;

height: 200px;

background-color: red;

}

</style>

</head>

<body>

<div class="logo">

<img src="logo.png">

    </div>

</body>

</html>


正在回答 回答被采纳积分+1

登陆购买课程后可参与讨论,去登陆

2回答
怎么都被占用了呢 2017-07-03 17:13:29

在这个案例中,你可以这么认为,不过它的原理你要知道:line-height控制文本垂直居中时,是将与 font-size 的计算值之差分为两半,分别加到一个文本行内容的顶部和底部。

  • 提问者 zjg23 #1
    单行文字的垂直居中可以直接将line-height设置为height,如果是我说的这种情况,line-height就要设置成height+img的height,我的理解对么?
    2017-07-03 16:41:24
问题已解决,确定采纳
还有疑问,暂不采纳

恭喜解决一个难题,获得1积分~

来为老师/同学的回答评分吧

0 星
前端小白入门系列课程
  • 参与学习           人
  • 提交作业       11218    份
  • 解答问题       36713    个

从一个不会编程的小白到一个老司机是需要过程的,首先得入门,学习基础知识,然后才能进阶,最后再到精通,本专题是你走进前端世界的不二选择!

了解课程
请稍等 ...
意见反馈 帮助中心 APP下载
官方微信

在线咨询

领取优惠

免费试听

领取大纲

扫描二维码,添加
你的专属老师