HTML中如何引入外部CSS文件及设置鼠标悬停样式

如何在HTML中引入外部CSS文件并设置鼠标悬停样式

本文将介绍如何在HTML网页中引入外部CSS样式表文件，并以设置鼠标悬停在超链接上时改变文本颜色为例，讲解如何编写CSS代码。

假设你的CSS样式表文件名为 'test.css'，要将其应用到HTML网页中，需要在HTML文档的 <head> 部分添加以下代码：

<link rel='stylesheet' href='test.css'>

这段代码告诉浏览器将 'test.css' 文件作为样式表加载并应用到当前页面。

要实现鼠标移到超链接上方时文本颜色变为红色，需要在 'test.css' 文件中添加以下CSS代码：

a:hover {
  color: red;
}

这段代码使用了CSS的伪类 'a:hover'，它表示当鼠标悬停在 <a> 元素上时应用的样式。'color: red;' 则设置文本颜色为红色。

通过以上步骤，你就可以在HTML网页中引入外部CSS文件并实现简单的鼠标悬停样式效果了。