CSS手機(jī)觸摸變色是一種非常常見的效果，它可以讓你在移動設(shè)備上提供更加友好和直觀的互動體驗(yàn)。下面是一些使用CSS代碼實(shí)現(xiàn)這個效果的技巧。

/* 首先我們需要定義一個類，用于觸發(fā)變色效果 */
.touch:hover {
background-color: #ccc;
}
/* 接下來我們需要檢測觸摸事件 */
@media (hover: none) {
/* 當(dāng)不支持hover事件時，我們可以通過active狀態(tài)進(jìn)行替代 */
.touch:active {
background-color: #ccc;
}
}

如上所示，我們需要為觸發(fā)變色效果的區(qū)域定義一個類名，這里我們使用了 ".touch"。我們可以在CSS中通過 ":hover" 偽類選擇器來定義觸摸事件，當(dāng)用戶的手指觸摸到該區(qū)域時就會出現(xiàn)變色的效果。

但是，有些移動設(shè)備可能不支持 ":hover" 事件，這時我們就需要使用 ":active" 偽類選擇器來代替。當(dāng)用戶觸摸該區(qū)域時，該區(qū)域就會處于":active"狀態(tài)。需要注意的是，我們需要使用@media查詢來檢測設(shè)備是否支持":hover"事件。

通過以上這些CSS代碼，我們就可以為移動設(shè)備增加一個簡單的觸摸變色效果。當(dāng)然，如果你想讓這個效果更加復(fù)雜，也可以結(jié)合JavaScript來實(shí)現(xiàn)更多的效果。