標題：設備列表代碼 CSS
隨著現(xiàn)代移動設備的普及，越來越多的設備種類和尺寸出現(xiàn)在市場上。為了便于用戶快速瀏覽和選擇設備，設備列表是我們常見的應用場景之一。在制作設備列表時，使用 CSS 可以輕松地改變列表的外觀和排版，使列表更加清晰易讀。
下面是一個簡單的設備列表代碼示例，使用 CSS 實現(xiàn)了設備名稱和尺寸的列表顯示：
```html
<!DOCTYPE html>
<html>
<head>
<title>設備列表</title>
<style>
ul {
list-style-type: none;
margin: 0;
padding: 0;
li {
margin: 0 10px;
padding: 0 5px;
display: inline-block;
width: 100%;
text-align: center;
li:nth-child(1) {
background-color: #f2f2f2;
li:nth-child(2) {
background-color: #ddd;
li:nth-child(3) {
background-color: #888;
li:nth-child(4) {
background-color: #c6c6c6;
li:nth-child(5) {
background-color: #a5a5a5;
</style>
</head>
<body>
<ul>
<li>iPhone 5</li>
<li>iPhone 6</li>
<li>iPhone 6 Plus</li>
<li>iPad 3</li>
<li>iPad 4</li>
<li>iPad Pro 9.7</li>
<li>iPad Pro 10.6</li>
<li>iPad Pro 11</li>
<li>Android Smartphone 5</li>
<li>Android Smartphone 6</li>
<li>Android Smartphone 6 Plus</li>
<li>Android平板電腦 4</li>
<li>Android平板電腦 5</li>
<li>Android平板電腦 6</li>
</ul>
</body>
</html>
在這個示例中，我們使用了 `ul` 標簽來創(chuàng)建設備列表。我們使用了 `list-style-type: none;` 屬性來隱藏列表中的列表項，使列表更加簡潔明了。我們使用了 `margin: 0;` 和 `padding: 0;` 屬性來使列表項居中對齊。
接下來，我們使用了 `li` 標簽來創(chuàng)建每個設備項的子元素。我們使用了 `margin: 0 10px;` 和 `padding: 0 5px;` 屬性來設置子元素的寬度和高度，以及內邊距。我們使用了 `display: inline-block;` 屬性來使子元素為塊元素，以便更好地與其他元素交互。
最后，我們使用了 `background-color` 屬性來設置每個設備項的背景顏色，使列表更加美觀。
通過使用 CSS，我們可以輕松地實現(xiàn)設備列表的清晰易讀的外觀和排版。希望這個示例能夠幫助你制作出更加優(yōu)秀的設備列表！