标签 li 是不是块级元素分析

块级元素：block-level，相信大家都知道吧（or Google it）。以前在写代码的时候，面对

• 标签总觉得很奇怪。 为什么它可以设定高度，但又不像

  这些元素，那种感觉就像它是个“半内联"的（内联：inline[text]-level）元素。HTML 4是这样描述的：
  

  The following elements may also be considered block-level elements since they may contain block-level elements:

  这段描述中，似乎也是在说， <li /> 就是一个"半内联"的元素。当然，这个列表里面的类似于 <td /> 这些元素，也曾给我带来这样的疑惑。今天看了一下各浏览器的默认CSS。结果是这样的：

  Browsers	CSS
  IE6/IE7	li{<a href="http://www.php.cn/wiki/927.html" target="_blank">display</a>:block;}
  IE8+ / Webkit / Firefox / Opera	li{display:list-item;}

  在这里，也基本上明了了。在除 IE6/7 以外的 A-Grade 浏览器中，就是一个"半内联"的元素。提到 display:list-item; ，其实，即使现在所有的 A-Grade 浏览器都支持，用的人其实不多。为什么？其实就是没什么用。在 Quirks Mode，PPK 是这样说的：
  

  display: list-item means that the element is displayed as a list-item, which mainly means that it has a bullet in front of it (like an UL), except in IE 5 on Mac where it gets a number (like an OL). The numbers are buggy: all previous LI’s in the page count as one, so this example starts with number 5 (the screenshot was made before I inserted my compatibility-LI’s).

  Live example:

  display: block

  display: list-item

  display: list-item

  Right。其实这个意义不大。但也算是解了自己的一个疑惑。分享出来，如果你也有这样的疑惑，或许下次 Coding 的时候出现 Bug 或者其他疑问，估计也就能很快反应过来了。

• DD – Definition description

• DT – Definition term

• FRAMESET – Frameset

• LI – List item

• TBODY – Table body

• TD – Table data cell

• TFOOT – Table foot

• TH – Table header cell

• THEAD – Table head

• TR – Table row

以上是标签 li 是不是块级元素分析的详细内容。更多信息请关注PHP中文网其他相关文章！