如何停止在HTML中的列表项之间添加空格的新行 [英] How can I stop the new line from adding a space between my list items in HTML

问题描述

我有以下HTML;

  li 
 {
 list-style：none; 
 border：固体1px蓝色; 
 display：inline; 
 margin：0px 0px 0px 0px; 
} 
 ... 
< ul> 
< li>第1项< / li> 
< li>第2项< / li> 
< li>第2项< / li> 
< / ul> 
  

当我在自己的行上添加列表项时，它们之间会出现水平间距，但是当我是这样做的;

 < li>项目1< / li>< li>项目2< / li>< ; li>第2项< / li> 
  

他们没有。

阻止新行显示为空白，还是我需要使用负余量？

解决方案

它们之间有空间是因为它们之间有空间。 ： - ）

您可以将 li 的位置浮动到左边，

  li {float：left; } 
  

Ciao！

I have the following HTML;

li 
{
    list-style: none;
    border: solid 1px blue;
    display: inline;
    margin: 0px 0px 0px 0px;
}
...
<ul>
    <li>Item 1</li>
    <li>Item 2</li>
    <li>Item 2</li>
</ul>

When I add the list items on their own line they appear with a horizontal space between them, but when I do it as;

<li>Item 1</li><li>Item 2</li><li>Item 2</li>

they dont.

Is there anyway to stop the new line from showing up as the blank space, or do I need to use a negative margin?

解决方案

The reason there is space between them is because there is space between them. :-)

You can float the li's to the left and that'll get rid of it:

li { float: left; }

Ciao!

这篇关于如何停止在HTML中的列表项之间添加空格的新行的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！