提问人：Pekka 提问时间：12/1/2009 最后编辑：randomPekka 更新时间：12/1/2009 访问量：5904
在 <li>s 之间有换行符
Having line breaks between <li>s
问：
我有一个水平菜单，由带有 .<li>display: inline
这些元素应该彼此无缝地相邻。
在源代码中，我希望将每个 li 放在一行上，以便于调试：
<li class="item1 first"> ... </li>
<li class="item2"> ... </li>
...
但是，如果我在每个元素之后添加一个，则菜单项之间会有间隙。我收集这是预期的行为，但是有没有办法使用巧妙的“空白”设置或其他东西将其关闭？\n
编辑：我不能使用浮点数，这是在CMS中，可以选择将列表项居中。
答：
0赞
EricSchaefer
12/1/2009
#1
CSS+float 是你的朋友。
评论
0赞
Pekka
12/1/2009
我不能使用浮点数，这是在CMS中，可以选择将列表项居中
0赞
Adam Pope
12/1/2009
#2
HTML 与空格无关 - 因此添加换行符应该没有效果。然而，一些浏览器的渲染引擎并不能完全做到这一点。
您可能想做的是添加
float: left;
到您的 li 标签，让它们彼此相邻。
评论
0赞
Pekka
12/1/2009
我不能使用 float，这是在 CMS 中，可以选择将列表项居中。
1赞
Ben James
12/1/2009
Adam：当然，在模式中不会忽略空格。否则，句子中的单词之间就没有空格。inline
1赞
Jeepstone
12/1/2009
#3
你有能力编辑CSS吗？如果是这样，您可以尝试调整 <li> 元素上的填充/边距。这似乎确实需要大量的可读性努力。
根据你使用的浏览器，你可以获得HTML Tidy http://users.skynet.be/mgueury/mozilla/，它为你提供了整理源代码的选项，这可能对调试很有用
评论
0赞
Pekka
12/1/2009
HTML Tidy 不是一个选项，因为它是我正在调试的生产代码。不过，好主意。
5赞
John O'Rourke
12/1/2009
#4
您可以避免渲染问题，但保持代码的可维护性，如下所示：
<ul
><li>item 1</li
><li>item 2</li
><li>item 3</li
></ul>
它删除了空格，但仍然很容易在文本编辑器中编辑项目，前提是您的 CMS 不会弄乱您输入的标记！
评论
0赞
Pekka
12/1/2009
嘿，这是个好主意！我想我会用这个。
0赞
Tracy Probst
12/1/2009
我本来打算提出同样的建议，约翰。换行符被视为空格，就像任何其他空格一样，大多数浏览器将它们转换为分隔单词或任何元素的单个空格。如果将新行放在标记内，浏览器将不会呈现它。
评论