CSS五彩篩子是一種使用CSS技術來制作多彩篩子的方法。通過使用CSS的不同屬性，我們可以創建一個漂亮的多彩篩子。

.dice {
width: 80px;
height: 80px;
text-align: center;
border: 3px solid black;
background-color: white;
font-size: 3em;
display: flex;
justify-content: center;
align-items: center;
}
/*生成不同顏色的篩子*/
.dice:before {
content: "";
position: absolute;
top: 0;
left: 0;
bottom: 0;
right: 0;
z-index: -1;
}
.dice[data-num="1"]:before {
background: linear-gradient(120deg, #2980b9, #8e44ad);
}
.dice[data-num="2"]:before {
background: linear-gradient(120deg, #e67e22, #e74c3c);
}
.dice[data-num="3"]:before {
background: linear-gradient(120deg, #1abc9c, #34495e);
}
.dice[data-num="4"]:before {
background: linear-gradient(120deg, #f1c40f, #2ecc71);
}
.dice[data-num="5"]:before {
background: linear-gradient(120deg, #7f8c8d, #9b59b6);
}
.dice[data-num="6"]:before {
background: linear-gradient(120deg, #2c3e50, #2980b9);
}

這里是一個實現了CSS五彩篩子的HTML代碼：

1
2
3
4
5
6

運行這段代碼，將會在頁面上創建一個多彩的篩子元素。每一次運行網頁，隨機的數字將會被展示在篩子上。

通過這個簡單的CSS技巧，我們可以很輕松地創造出更加生動、更加豐富的網頁效果。