內聯元素的寬度正在改變而不使其成為一個塊？

Question

在下面的代碼中：

<html>
<head>
    <style type="text/css">
    ul
    {
     list-style-type:none;
     margin:0;
     padding:0;
    }
    a
    {
     display:block;
     width:60px;
     background-color:#dddddd;
    }
 </style>
 </head>

 <body>
      <ul>
      <li><a href="#home">Home</a></li>
      <li><a href="#news">News</a></li>
      <li><a href="#contact">Contact</a></li>
      <li><a href="#about">About</a></li>
      </ul>
 </body>
 </html>

在這里，即使我沒有將錨顯示為一個塊然后仍然在改變它的寬度，它實際上正在改變。 但是，我讀過：

W3C 的 CSS2 規范指出，對於內聯、不可替換的元素，“'width' 屬性不適用”。

誰能給我解釋一下，為什么會這樣？謝謝...

Answer 1

我在 Firefox、IE、Chrome 和 Opera 中試過這個，如果你不將錨元素變成塊元素，它們都不會應用寬度。

但是，我確實嘗試使用 jsfiddle，其中頁面具有 doctype。 您的頁面沒有 doctype，因此它以 quirks 模式呈現，這可能會在某些瀏覽器中觸發異常行為。

內聯元素的寬度正在改變而不使其成為一個塊？

問題描述

1 個解決方案

解決方案1
1 已采納 2011-07-16 07:47:35

內聯元素的寬度正在改變而不使其成為一個塊？

問題描述

1 個解決方案

解決方案1 1 已采納 2011-07-16 07:47:35

解決方案1
1 已采納 2011-07-16 07:47:35