在HTML中，要实现鼠标悬停在文字上时文字变色的效果，可以通过CSS（层叠样式表）来完成，CSS是一种用于描述HTML文档样式的语言，它可以让你轻松地控制网页的外观和布局，下面，我将详细介绍如何使用CSS实现这个功能。
你需要为你的文字创建一个类（class）或者直接为特定的HTML元素设置样式，这里我们以创建一个名为"hover-color"的类为例，在你的HTML文档的<head>部分，你可以这样写：
<style>
.hover-color {
/* 初始颜色设置 */
color: #000000; /* 黑色 */
transition: color 0.3s; /* 过渡效果，颜色变化时间 */
}
/* 鼠标悬停时的颜色变化 */
.hover-color:hover {
color: #ff0000; /* 红色 */
}
</style>
在上面的代码中，.hover-color 是我们创建的类名，color 属性用于设置文字的颜色，我们首先设置了文字的初始颜色为黑色（#000000），然后使用 :hover 伪类选择器来定义当鼠标悬停在这些文字上时的颜色变化，这里我们将其设置为红色（#ff0000）。transition 属性用于添加一个平滑的颜色过渡效果，使得颜色变化看起来更加自然。
接下来，在HTML文档的正文部分，你可以这样使用这个类：
<p>这是一些普通的文字。</p> <p class="hover-color">将鼠标悬停在这段文字上，它会变成红色。</p>
在上面的例子中，第二段文字使用了我们之前创建的 hover-color 类，当你将鼠标悬停在这段文字上时，它的颜色会从黑色变为红色。
你还可以通过CSS的其他属性来进一步自定义这个效果，比如改变文字的字体、大小、背景颜色等，你可以添加以下代码来为悬停的文字添加一个背景色：
.hover-color:hover {
background-color: #ffdddd; /* 浅红色背景 */
}
通过这种方式，你可以轻松地为HTML文档中的文字添加交互式的颜色变化效果，从而提高用户体验和页面的吸引力，记住，CSS是一个非常强大的工具，它可以让你的网页设计变得更加多样化和个性化。