Question

我想在<br/>内打破<li>行像：

第一行
第二行
Second li
第三名

但是当这样做时（两个标签） - 我在他们之间得到一个空格。保证金和填充是0，但我仍然得到它.. 任何想法如何摆脱它？谢谢！

Answer 1

这是一个简单的解决方案......

在<br/><br/>中添加<li>，会在

下方添加空白换行符

<ul>
    <li>Line 1<br/><br/></li>
    <li>Line 2</li>
    <li>Line 3</li>
    <li>Line 4<br/><br/></li>
    <li>Line 5</li>
</ul>

Answer 2

您可以更改css中的line-height属性。这有帮助吗？

Answer 3

作为Wordpress的旁注， 和<br />会在结束</li>之前自动删除。

以hacky的方式，您可以使用零宽度非连接符（&zwnj;）或不可见的分隔符（⁣）。

在文字模式下，执行回车并在结束&zwnj;之前插入</li>。

示例：

<ul>
  <li>List item with a blank line below
  &zwnj;</li>
  <li>List item</li>
</ul>

Answer 4

对于像我这样结束这个问题的未来人：将white-space: pre-wrap;添加到<ul>为我工作！它也可以与\n一起使用作为额外的奖励：）

ul {
  white-space: pre-wrap;
}

Answer 5

试试这个

<ul>
    <li>First Line</br>First Second Line</li>
    <li>Second Line</li>
</ul>

Check This

Answer 6

对Rudrik的改进答案：

<UL>
   <LI>First Line
      <DD>Second Line</DD> <!-- No Space -->
   </LI>
   <LI>Third Line</LI>
   <LI>Fourth Line</LI>
</UL>

字！

Answer 7

  <dl>
<dt>Coffee</dt>
<dd>- black hot drink</dd>
<dt>Milk</dt>
<dd>- white cold drink</dd>
</dl>





  Coffee
    - black hot drink
  Milk
    - white cold drink

希望这可能有帮助......

Answer 8

尝试使用“line-height”。

Answer 9

这可能适合你吗？

<ul>
    <li><div>First line</div> second line</li>
    <li>Second li</li>
    <li>third li</li>
</ul>

Answer 10

使用内联CSS，创建一个具有固定高度但没有内容的分区，以在列表项之间创建空行，就像使用嵌套列表一样。如果您对CSS不太了解，只需复制此解决方案并编辑高度（以像素为单位）以更改空行高度。使用此代码在列表中的任何位置放置一个空行，并为创建的每个空行设置所需的高度。：

<ul>
    <li>Line 1</li>
    <li>Line 2</li>
    <li>Line 3</li>
    <li>Line 4
       <div style="height: 10px;">
       </div>
    </li>
    <li>Line 5</li>
</ul>

Answer 11

尝试一下；

/ * CSS * /

#keyskills:after {
content:"I.T. – data analytical, planning, design and interaction skills \A Data logging and reporting - averaging about 60 WPM \A Research skills, able to provide intermediate I.T. support ";
white-space: pre;

}

/ * HTML主体* /

<p id="keyskills">

Answer 12

尝试使用flex以及flex-direction。它为我工作。

Answer 13

尝试使用

li{
    float: none;
}

列表项内的换行符会在行之间生成空格

13 个答案: