將文本包裝到項目符號右側的原因是瀏覽器將整個list-item元素呈現在項目符號的右側。它將始終將文本包裝在包含文本的元素中。

最簡單的解決方案是不使用內置列表項目項目符號。

取而代之的是創建一個你喜歡的子彈的圖像并使用float：left將它放在左上角。文本將圍繞它并給你你想要的結果。

li { list-style-type:none; }

img{ float:left; }

• my short text
• my very very long text

的其他一些觀點： 由于不同的瀏覽器上的填充不同，名單的利潤，你應該將它們設置： (設為您的首選保證金)：

ul { padding:0; margin:30px }

ul li{ padding:0; margin:0 }

而且，它是更好使用與背景色是您的首選子彈元素：

span.bullet {float:left; height:10px; width:10px; background:url(bullet.gif) no-repeat}

最后，一個更好的想法是完全不使用圖像 - 但而不是使用unicode項目符號為所有文本加上前綴。 或者，如果您的用戶使用現代瀏覽器，請在CSS中添加unicode字符。 但是，我現在沒有時間來查看這個。 Praps今天晚些時候。

總結

以上是生活随笔為你收集整理的html列表变成三个一行,HTML列表仅限第一行缩进的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。