如何删除列表边距？ [英] How to remove list margin?

问题描述

我有一个包含3个项目的列表。但是，它的左侧有一点空白，我希望它消失。

这是我的代码：

< pre class = snippet-code-css lang-css prettyprint-override> ul li {display：inline; list-style：无；}

 < ul> < li>我的左侧有边距< / li> < li>列表2< / li> < li>列表3< / li> / ul< p> Hi！我是没有任何边际的文字！< / p>  

解决方案

只需将 ul 的填充设置为0。这是一个代码段：

  ul {padding：0;} ul li {display：inline; list-style：无；}  

 < ul> < li>嘿，现在我的左侧没有多余的空间！< / li> < li>列表2< / li> < li>列表3< / li> / ul< p> Hi！我是没有任何边际的文字！< / p>  

I have a list that contains 3 items. However, it has a little margin on its left side, I want it to disappear.

Here is my code:

ul li {
  display: inline;
  list-style: none;
}

<ul>
  <li>I have margin space on my left side</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>
<p>
Hi! I am a text without any margin!
</p>

解决方案

Just set padding of your ul to 0. Here's a snippet:

ul {
    padding: 0;
}

ul li {
  display: inline;
  list-style: none;
}

<ul>
  <li>Hey, now I don't have extra space on my left side!</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>
<p>
Hi! I am a text without any margin!
</p>

这篇关于如何删除列表边距？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！