鍍金池/ 問(wèn)答/HTML5  HTML/ 剛學(xué)html和css想問(wèn)下各位，為什么文字居中了圖片不居中？

剛學(xué)html和css想問(wèn)下各位，為什么文字居中了圖片不居中？

<!DOCTYPE html>
<html>
<head>

<title></title>
<style type="text/css">
    div{
        width: 200px;
        height:200px;
        background-color: pink;
    }
    img{
        text-align: center;
    }
    h1{
        text-align: center;
    }
</style>

</head>
<body>
<div>

<img src="img/blue-camera.png">
<h1>火箭總冠軍</h1>

</div>
</body>
</html>

把img里的text-align:center;寫在div里圖片就居中了！這是為什么？不是子元素居中為什么要寫在父元素里啊

回答
編輯回答
胭脂淚

text-align: center的意思是使該元素內(nèi)部的行內(nèi)元素居中。
而img一種特殊的行內(nèi)元素，我們暫且將其視為行內(nèi)元素。這樣，設(shè)置div為center即設(shè)置了圖片在容器中居中。
就像文字在h標(biāo)簽中居中一樣。

2018年1月6日 02:59
編輯回答
陌璃

emmmm...怎么說(shuō)呢，img是單標(biāo)簽，h1.div等等都是雙標(biāo)簽，下面可以按需嵌套子標(biāo)簽，單標(biāo)簽是不能嵌套子集的，所以它自己相對(duì)于父集的 居中就需要寫在父元素上了

2017年10月5日 12:14
編輯回答
獨(dú)特范

text-align 屬性規(guī)定元素中的文本的水平對(duì)齊方式。是“文本”的對(duì)齊方式
故用在img上無(wú)效

2018年5月16日 22:48
編輯回答
逗婦乳

我知道了，img是內(nèi)聯(lián)塊狀元素，text-align:center作用的是塊狀元素內(nèi)的內(nèi)容

2017年4月28日 13:00