CSS觸碰文字是指鼠標移動到文本上時，文本發生視覺上的變化。這種效果可以增強網站的互動性，提高用戶體驗。下面我們來看看如何通過CSS實現觸碰文字效果。

.hover-text:hover {
color: red;
}

以上代碼是實現觸碰文字效果的基本樣式。我們首先需要定義一個類名為“hover-text”的元素，然后使用:hover偽類選擇器來定義鼠標觸碰時的樣式。

在上面的代碼中，我們使用了color屬性來改變文字顏色為紅色。這個屬性可以被替換成任何你想要的CSS屬性，比如字體大小、背景顏色等。

接下來，讓我們來看一些更高級的觸碰文字效果。

.hover-text {
position: relative;
display: inline-block;
transition: all 0.3s;
}
.hover-text:after {
position: absolute;
content: "";
left: 0;
bottom: -2px;
height: 3px;
width: 100%;
background-color: #008000;
visibility: hidden;
transition: all 0.3s;
}
.hover-text:hover {
color: #008000;
}
.hover-text:hover:after {
visibility: visible;
transform: scaleX(1);
}

以上代碼實現了一個比較高級的觸碰文字效果。首先，我們將文本元素的display屬性設置為inline-block，這可以讓其自動適應文本的大小。然后，我們給文本元素加上了一個偽元素“:after”，用來實現下劃線效果。

在:hover偽類選擇器下，我們改變了文本顏色為綠色，并使用transform屬性縮放下劃線的寬度來顯示下劃線。

這是CSS觸碰文字效果的簡單實現，可以用于網站中不同的場景。無論你是想要的是簡單的顏色變換還是復雜的效果，CSS都可以達到你想要的效果。