如何在css中的一行中制作列表答案

【问题标题】：How to make list in one line in css如何在css中的一行中制作列表
【发布时间】：2017-08-08 22:11:06
【问题描述】：

我放入主题自定义小部件，我需要在一行中制作列表，我该怎么做？我什么都试过了

【问题讨论】：

请添加您的代码。
您的问题很容易被重播，但是您可以简单地在google上搜索，无论如何您必须在您的问题中添加代码sn-p，这样我们就不必重新创建所有代码，并且您无法发布您的网站链接，您可能会发现阅读此内容很有用：stackoverflow.com/help/how-to-ask

【解决方案1】：

您可以通过display: inline-block 实现此目的。

#menu-cz-odkazy li {
    display: inline-block;
}

对于项目之间的一些空间，例如给 li 一个 5px 的 margin-right。

【讨论】：

【解决方案2】：

#menu-cz-odkazy li {display: inline-block;}

添加你的CSS

【讨论】：

【解决方案3】：

一种选择是让你的ul 成为一个弹性盒子

#menu-cz-odkazy {
  display: flex;
  justify-content: space-between;
  list-style: none;
}

<div class="menu-cz-odkazy-container">
  <ul id="menu-cz-odkazy" class="menu">
    <li id="menu-item-1555" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1555"><a href="https://www.propiska-reklamni.cz/">propiska-reklamni.cz</a></li>
    <li id="menu-item-1556" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1556"><a href="https://www.reklamni-cukrovinky.cz/">reklamni-cukrovinky.cz</a></li>
    <li id="menu-item-1557" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1557"><a href="https://www.reklamnidary.cz/">www.reklamnidary.cz</a></li>
    <li id="menu-item-1558" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1558"><a href="http://www.usbdary.cz/">usbdary.cz</a></li>
    <li id="menu-item-1559" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1559"><a href="https://www.papirovedary.cz/">papirovedary.cz</a></li>
    <li id="menu-item-1560" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1560"><a href="http://www.expresdary.cz/">expresdary.cz</a></li>
    <li id="menu-item-1561" class="menu-item menu-item-type-custom menu-item-object-custom menu-item-1561"><a href="https://www.textil-pro-firmy.cz/">textil-pro-firmy.cz</a></li>
  </ul>
</div>

【讨论】：