李爲什麼默認爲換行符？

基本的CSS問題。爲什麼li項目在默認情況下會以新行結束？李爲什麼默認爲換行符？

<ul> 
    <li>One</li> 
    <li>Two</li> 
</ul>

塊元素以新行結束，但它不在MDN的列表block elements中。相反，they are list-items和它們的默認CSS是這樣的：

li { 
    display: list-item; 
    text-align: -webkit-match-parent; }

我只是看到，如果有一個大致的瞭解，這將解釋這還是我必須學會list是一個特例。

富

的CSS1 spec爲列表項元素表示：

與「列表項」的「顯示器」的屬性值

元素被格式化爲塊級元素，但通過前面列表項標記。標記的類型由'list-style'屬性確定。標記根據「名單式」屬性的值設置：

然而，MDN描述其執行以下列方式規範的，說明該列表項的顯示值：

...爲內容和單獨的列表項內聯框生成一個塊框。

無論哪種方式，display:list-item會產生這迫使本身就是一個塊級元素，由之前，其內容基本上是後添加一個換行符在新行繪製。

2014-01-18 11:56:35

所以，ul是一個塊，它用盡了寬度。它把它的項目放在一個內聯框中，默認情況下這些項目會在一個新行（奇數給定內聯名稱？）結束。我試圖瞭解是否有一條通用規則，但聽起來像我必須知道列表默認情況下將項目放在新行上？ –

所有列表類型（'ul'，'ol'和'dl'）都是[塊級元素]（https://developer.mozilla.org/en-US/docs/HTML/Block-level_elements）。 'li'元素也可以被認爲是塊級別的，只是添加了一個前面的標記。 –

好的，我會購買:-)雖然它不是一個標準的塊元素（並且從塊元素列表中缺少），但就格式而言，它是一個塊元素。謝謝伊恩。 –

li元素與塊元素相關。塊元素始終佔據整條線。請記住h1，h2，h3，h4，div元素等。這些元素也具有相同的屬性。正如您已經注意到的那樣，這些元素可以使用顯示內聯塊來放置。

2014-01-18 11:56:40

通過關係你的意思是它的父母是ul？李不是塊元素 - 顯然是一個內聯框。我會想象它就像文本一樣，只是填充寬度，直到它碰到框的邊界，然後進入下一行。顯然，情況並非如此:-) –

是的，它們被定位爲一個新行，每個標籤默認爲li，因爲它是「list」標籤。

2014-01-18 11:57:01 Manolo

回答