CSS圖標設置多行的方法

在CSS中，我們可以使用列表（List）來設置多行圖標，我們需要創(chuàng)建一個包含多個圖標的列表，每個圖標作為一個列表項（List Item），我們可以使用CSS的偽元素（Pseudo-elements）或者背景圖像（Background Images）來為每個列表項添加圖標。

下面是一個簡單的示例，展示如何使用CSS設置多行圖標：

HTML代碼：

<ul class="icon-list">
  <li class="icon-item">圖標1</li>
  <li class="icon-item">圖標2</li>
  <li class="icon-item">圖標3</li>
  <li class="icon-item">圖標4</li>
  <li class="icon-item">圖標5</li>
  <li class="icon-item">圖標6</li>
  <li class="icon-item">圖標7</li>
  <li class="icon-item">圖標8</li>
  <li class="icon-item">圖標9</li>
  <li class="icon-item">圖標10</li>
</ul>

CSS代碼：

.icon-list {
  list-style: none;
  padding: 0;
}
.icon-item {
  float: left;
  width: 20px;
  height: 20px;
  margin: 5px;
}
.icon-item:before {
  content: url('圖標路徑'); /* 替換成你的圖標路徑 */
}

在這個示例中，我們創(chuàng)建了一個包含10個圖標的列表，每個圖標作為一個列表項，并使用偽元素為每個列表項添加圖標，你可以根據(jù)自己的需求調(diào)整圖標的數(shù)量、大小和位置，你也可以使用其他方法來實現(xiàn)多行圖標，比如使用背景圖像或者SVG圖像。