大佬教程收集整理的这篇文章主要介绍了如何删除列表项之间的空格，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。
在现代浏览器中，flex-Box是执行此操作的首选方法。就像这样简单：
ul {
display: flex;
}
。
对于旧版浏览器的支持，请参考下面的其他选项，尽管稍微复杂一些，但它们仍然不错。
尽管每个其他答案至少提供了一个好的解决方案，但似乎没有一个提供 所有@H_673_15@ 可能性。这就是我将在这里尝试做的。
首先，要回答关于 为什么@H_673_15@ 存在间距的隐式问题，它 之所以@H_673_15@ 存在，是因为您已将li设置为显示为嵌入式元素。
inline是我所知道的所有浏览器中文本和图像的默认显示值。只要代码中有空格，内联元素就会以它们之间的间隔呈现。当涉及到文本时，这是一件好事：由于我在代码中包含的空格，因此我将这些键入的单词分隔开。每行之间也有间隔。正是内联元素的这种行为使Web上的文本完全可读。
但是有时我们希望非文本元素能够inline利用此显示样式的 其他@H_673_15@
属性。这通常包括我们的元素紧密贴合在一起的愿望，这与文本完全不同。这似乎是您的问题。
事不宜迟，以下是我所知道的摆脱间距的所有方法：
请注意，您将需要“猜测”空间的大小。不建议这样做，因为正如Arthur在下面的注释中所指出的那样，用户可以更改其浏览器的Zoom，这很可能会弄乱代码的呈现。此外，此代码需要太多的猜测和计算。有更好的解决方案可以在所有条件下工作。
摆脱空白
<li>One</li><li>Two</li>
使用注释使空白成为注释
<li>One</li><!--
–>
跳过结束标记（对HTML4有效]/对[HTML5有效
<li>One
将空白放在标签本身中（ 注意：早期的Internet Explorer不会这样@H_673_15@ ）
<li>One</li
利用这样的事实，即元素之间的间距是按父字体大小的百分比计算的。因此，将父级的字体大小设置为0将导致没有空格。只需记住在上设置非零字体大小，以li使文本本身具有非零字体大小。在Jsfiddle上查看。
如何摆脱列表项之间的空白？我正在努力使图像彼此相邻。即使我将样式设置为@H_758_6@margins: 0;，它们仍然分开。
CSS
ul.frames{
margin: 20px;
width: 410px;
height: 320px;
BACkground-color: grey;
float: left;
list-style-type: none;
}
ul.frames li {
display:inline;
margin: 0;
display: inline;
list-style: none;
}
ul.frames li img {
margin: 0 0 0 0;
}
HTML
<li>
<img id="myImg" src="img.jpg" width="102.5px" height="80px"/>
</li>
<li>
<img id="myImg2" src="img.jpg" width="102.5px" height="80px"/>
</li>
<li>
<img id="myImg3" src="img.jpg" width="102.5px" height="80px"/>
</li>
<li>
<img id="myImg4" src="img.jpg" width="102.5px" height="80px"/>
</li>
以上是大佬教程为你收集整理的如何删除列表项之间的空格全部内容，希望文章能够帮你解决如何删除列表项之间的空格所遇到的程序开发问题。
如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。
本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。