怎么样才能使ul里的每个li都按一定的间隔横向排列并且不受输入li标签内的字的多少影响

你可以使用CSS中的`display: flex`和`justify-content: space-between`属性来实现这个效果。具体实现方法如下：

HTML代码：

<ul class="list">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ul>

CSS代码：

.list {
  display: flex;
  justify-content: space-between;
  list-style: none;
  padding: 0;
  margin: 0;
}

.list li {
  background-color: gray; /* 仅为示例 */
  padding: 10px;
  color: white; /* 仅为示例 */
}

在上面的代码中，我们将`ul`元素的`display`属性设置为`flex`，这样`li`元素就会按照一定的间隔横向排列。`justify-content: space-between`属性将在每个`li`元素之间加上一定的间距，而不受`li`标签内的字的多少影响。最后，我们还将`list-style`、`padding`和`margin`属性设置为0，以便去掉默认的列表样式和边距。

你可以根据实际需求调整`padding`和`background-color`等属性。