css 如何在行内块中显示垂直溢出的项目

Question

index.jpg

我想使用 css 或 js 显示第 1 列中的前五项和第 2 列中的其余五项。

请帮帮我。谢谢

Answer 1

您可以使用弹性布局来设置列。

ol {
  display: flex;
  flex-flow: column wrap;
  height: 100px;
}

li {
  width: 150px;
}

a {
  display: inline-block;
}

<ol>
  <li>Item 1</li>
  <li>Item 2</li>
  <li>Item 3</li>
  <li>Item 4</li>
  <li>Item 5</li>
  <li>Item 6</li>
  <li>Item 7</li>
  <li>Item 8</li>
  <li>Item 9</li>
  <li>Item 10</li>
  <li>Item 11</li>
  <li>Item 12</li>
  <li>Item 13</li>
  <li>Item 14</li>
  <li>Item 15</li>
</ol>

css 如何在行内块中显示垂直溢出的项目

how to display vertically overflowed items in inline block in css

html

javascript

css

inline