Question

我需要将UL列表放在p标签内。我只添加了内部p标签，但它并没有完全从p标签开始。并且p标签的宽度为1600px，所以我需要li元素超出该宽度（我有滚动条）。现在li元素在多行中流动。

Answer 1

不幸的是，HTML不允许ul（或div）位于p内，因此浏览器会自动更正DOM：

<p>
    <ul><li>etc</li></ul>
</p>

......看起来像这样：

<p></p>
<ul><li>etc</li></ul>
<p></p>

您可以使用内置的开发人员工具对此进行验证。所以你需要改变你的标记。也许将p更改为div？

至于问题的第二部分，这是一个很好的起点：

ul.list2 {
    width: 500px; /* adjust to suit your needs */
    overflow: auto;
    white-space: nowrap;
}
ul.list2 li {
    display: inline-block;
    vertical-align: top;
}

它将ul设置为在必要时使用滚动条，并告知其中的内联元素不要换行。然后它将列表项设置为内联块项，这使它们并排放置（如display：inline;）但行为更像块项（即边距，填充，宽度，高度按预期工作）。 / p>

在段落中扩展Ul列表

1 个答案: