CSS 是一種網頁樣式表語言，可以用來設置網頁中的文本、背景、顏色、大小、位置等各種屬性。在實際應用中，我們經常會遇到需要控制元素個數的情況，例如只顯示最多 5 個列表項，超過 5 個的需要隱藏起來。那么 CSS 如何實現這種控制元素個數的效果呢？

/* 通過 nth-child 選擇器來控制數量 */
ul li:nth-child(n+6) {
display: none;
}

上面的代碼中，我們通過 CSS 偽類選擇器:nth-child()選擇了列表中的第 6 個及其之后的項，然后設置它們的顯示為none，即隱藏起來。這樣就能實現只顯示前面 5 個列表項的效果。

除了使用:nth-child()選擇器外，CSS 還可以通過@media媒體查詢來實現類似的效果。

/* 通過媒體查詢控制數量 */
@media screen and (max-width: 500px) {
ul li:nth-child(n+6) {
display: none;
}
}

上面的代碼中，我們通過@media媒體查詢選擇了當前屏幕尺寸小于500px的情況，并且隱藏了第 6 個及其之后的項。這樣就能實現在移動設備上只顯示前面 5 個列表項的效果。