如何使用響應式版面配置在列中顯示清單項目？

在響應式版面配置中將清單項目顯示為列

根據瀏覽器寬度垂直顯示清單項目的目標可以透過以下方式實現CSS3 列。操作方法如下：

使用 HTML，將清單項目包裝在

<div> 中。具有固定高度並使用column-count屬性指定列數：

<div>

在CSS中，定義容器的高度並確保每個列表項目以內聯區塊方式顯示：

#limheight {
  height: 800px;
  column-count: 3;
}

#limheight li {
  display: inline-block;
}

當瀏覽器調整大小時，CSS3會自動調整列數並重新排列清單項目以最佳化其顯示。顯示的特定列數將取決於可用寬度和清單項目本身的寬度。

使用此技術，您可以實現響應式佈局，其中列表項目以垂直線顯示，列根據瀏覽器大小動態調整。