CSS列表項位于一行是我們在前端開發中經常會遇到的問題之一。下面我們來學習一些CSS技巧，可以讓我們輕松達到這種效果。

ul {
display: flex;
flex-wrap: wrap;
justify-content: space-between;
align-items: center;
padding: 0;
margin: 0;
}
li {
list-style: none;
width: calc(33.33% - 10px);
margin-bottom: 20px;
}

以上代碼是一種常見的實現方式，主要是利用了flexbox布局。我們將ul元素的display屬性設為flex，這樣就能讓其子元素(li)變成行內塊元素。flex-wrap屬性設置為wrap，讓當子元素的總寬度超過了ul的寬度時，子元素換行顯示。justify-content屬性設置為space-between，子元素將左右對齊，中間自動留有空白。align-items屬性可以使子元素垂直居中，padding和margin屬性設為0，去除默認值。

接下來我們設置li元素，將list-style設為none，去除默認樣式。將width屬性設為calc(33.33% - 10px)，強制每行只能顯示3個元素，每個元素的寬度為總寬度的1/3，減去10px的margin。margin-bottom屬性設為20px，給每個li元素下方留出20px的空白，美化樣式。

以上代碼是實現CSS列表項位于一行的一種常用方法。我們可以根據需求通過調整屬性值，達到不同的效果。希望本文對您有所幫助。