为什么<a>元素不继承子元素的大小

Question

我有一个非常非常简单的HTML,通常HTML中的所有内容似乎都应该正常工作,但在这种情况下,它不会.我认为标签的大小应该继承子图像标签.但在下面的情况下,尺寸是不同的.

HTML:

<a href="."><img src="some image"></a>?

CSS:

a {
    border: 1px solid #000;
    width: auto;
    height: auto;
}

img {
    border: 1px solid #F00;
}
?

为什么不<a>继承图像的大小？(见:http://jsfiddle.net/49ykj/)

到目前为止,这在Firefox和Chrome中都会发生,所以我假设它发生在所有浏览器中.这是一个错误吗？为什么不应该是一个bug？

Answer 1

发生这种情况是因为a内联元素img是内联块元素.display将a元素的css 属性更改为内联块,您会注意到它们具有相同的大小.

这不是一个错误.它只是css的本质和大多数浏览器以这种方式初始化两个元素css属性的事实.