这段代码可以在我测试过的所有浏览器中运行。如果你还没有找到答案，建议最流行的答案是有效的。如果你想让它换行，只需调整宽度。

<ol style="list-style-type:decimal; width: 600px;">
    <li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
    <li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
    <li style="float: left; width: 200px; padding: 2px 0px;">Test</li>
</ol>

ol.horizontal{
    list-style-type: decimal;
    width: 600px;
}

ol.horizontal li{
    float: left;
    width: 200px;
    padding: 2px 0px;
}

<ol class="horizontal">
    <li>Test</li>
    <li>Test</li>
    <li>Test</li>
</ol>

你能用这个CSS吗？

li  {display: inline}

• EDIT*：这不会保留项目编号，我不知道有任何方法可以做到这一点。作为替代，我想你所能做的就是手动插入数字，直到浏览器对CSS计数器有更好的支持。

我已经尝试了this page上的每个display属性，当在IE中水平显示列表时，它们都没有保留有序列表编号（在Firefox，Opera或Safari for Windows中也没有保留它们-通过扩展可能是Google Chrome，尽管我承认我没有测试每个display属性）。
唯一的解决方案（部分-仅在Firefox中）是Al W的答案。
我认为如果你想要一个水平编号的列表，你将不得不在服务器上生成它，或者在客户端使用JavaScript操作列表以重新插入数字。

好的，你需要在css中添加一个float、width和list-style-type属性。看起来像这样：

li{
    float:left;
    width:50px;
    list-style-type:decimal;
}

古石肯

你不能在行内元素上设置宽度。所以我通常会把它们浮动起来

li
{
    float: left;
    width:30px;
}

css：

li { display:inline; }

我发现这个关于IEhasLayout的页面很有用，它包括了关于列表格式的讨论（链接指向页面的列表部分）

编辑：一个更可靠的解决方案将是使用灵活的框，可以容纳更长的项目更好。

.items {
  display: flex;
}

.items > li {
  flex: 1;
}

<ol class="items">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ol>

原始答案：
这已经很晚了，但是如果你事先知道条目的数量，并且条目很短，不会跨越多行，你可以使用css属性column-count，现在所有现代浏览器都支持它。

.items {
  column-count: 4;
}

<ol class="items">
  <li>One</li>
  <li>Two</li>
  <li>Three</li>
  <li>Four</li>
</ol>

我是这么做的：

ol {
  display: flex;
  flex-direction: row; // this is the default for flex-direction but this demonstrates that row sets the items in a horizontal layout which is what you want
  flex-wrap: wrap; // if you want to wrap the list onto the next line
  list-style-type: decimal; // set the type of numbers to display, in this case decimals
  list-style-position: inside; // set bullets to display inside the list so that they don't overlay each list item
}

li {
  margin-right: 3rem; // set some margin if you want some spacing between list-elements
}

<ol>
    <li>One</li>
    <li>Two</li>
    <li>Three</li>
    <li>Four</li>
</ol>