为什么内联块不“可见”？

Question

内联块似乎使元素与＆＃34;：visible＆＃34;不匹配选择？

$('body').append($('<p>').css('display', 'inline-block'))
var p = $('p');
p.is(':visible');
==> false

p.css('display', 'block');
p.is(':visible');
==> true

Answer 1

来自jQuery（http://api.jquery.com/visible-selector/）：

  

如果元素占用文档中的空间，则认为元素是可见的。可见元素的宽度或高度大于零。

空的内联块的高度和宽度为0（宽度基于包含的元素）

空块元素的宽度为

http://i.snag.gy/cLLei.jpg

可以在w3.org找到有关内联和块级元素的宽度确定方式的更多信息。

编辑：正如FabrícioMatté所指出的，这假设元素都是空的并附加到DOM。分离，甚至块元素都没有父计算布局，并将返回false。