我样式化链接 - 学习 Web 开发
样式化链接 上一页 概述：为文本添加样式（样式化文本） 下一页
当为链接添加样式时，理解利用伪类有效地建立链接状态是很重要的，以及如何为链接添加样式来实现常用的功能（如导航菜单和选项卡）。我们将在本文中关注所有这些主题。
前提：
HTML 基础（已学习
HTML 简介）、CSS 基础（已学习
CSS 简介）、CSS 文本和字体基础。
目标：
学习如何将样式应用到链接状态，以及如何使用链接实现常见的 UI
功能，比如导航菜单。
让我们来看一些链接在创建超链接一文中，我们了解了如何根据最佳实践在 HTML 中实现链接。在本文中，我们将以这些知识为基础，向你展示为超链接设计样式的最佳做法。
链接状态第一件需要理解的事情是链接状态的概念，链接存在时处于不同的状态，每一个状态都可以用对应的伪类来应用样式：
Link：有目的地的链接（即不只是一个具名锚点），使用 :link 伪类来应用样式。
Visited：已访问过（存在于浏览器历史记录中）的链接，使用 :visited 伪类来应用样式。
Hover：被用户鼠标指针悬停的链接，使用 :hover 伪类来应用样式。
Focus：被选中的链接（比如通过键盘的 Tab 移动到这个链接，或者使用像 HTMLElement.focus() 这样的方法编程地聚焦链接），使用 :focus 伪类来应用样式。
Active：激活（如点击）的链接，使用 :active 伪类来应用样式。
默认样式下面的示例说明了默认情况下链接的外观和行为；不过 CSS 会放大文本并将其居中，使其更加突出。你可以将示例中默认样式的外观和行为与本页中应用了更多 CSS 样式的其他链接的外观和行为进行比较。默认链接具有以下属性：
链接以下划线表示。
未访问链接为蓝色。
已访问链接为紫色。
悬停链接时，鼠标指针会变成一个小手图标。
聚焦链接的周围有一个轮廓——按下键盘上的制表符键，就能聚焦本页面上的链接。（在 Mac 上，需要使用 option + tab，或通过按下 Ctrl + F7 启用全键盘控制选项。
活动链接为红色。尝试在点击链接时按住鼠标键。
html
cssp {
font-size: 2rem;
text-align: center;
}
备注：
本页中的所有链接示例都链接到窗口顶部。空片段（href="#"）用于创建简单示例，并确保每个包含在