:focus

优质

小牛编辑

127浏览

2023-12-01

描述 (Description)

:focus伪类用于在元素具有焦点时为元素添加特殊效果。

在 ... 块中定义伪类时，应注意以下几点 -

a:hover必须在a:link和a:在CSS定义中访问才能生效。
a:主动必须在a:hover in CSS定义后才能生效。
伪类名称不区分大小写。
伪类与CSS类不同，但它们可以组合在一起。

可能的值 (Possible Values)

color - 任何有效的颜色值。

适用于 (Applies to)

锚点/链接元素。

例子 (Example)

以下是演示如何使用的示例:focus类来更改焦点链接的颜色。

<html>
   <head>
      <style type = "text/css">
         a:focus {color: #0000FF}
      </style>
   </head>
   <body>
      <a href = "/html/index.htm">Click this Link</a>
   </body>
</html>

这将产生以下链接。当此链接聚焦时，这会将颜色更改为橙色，然后您专注于任何其他链接，以便在失去焦点时看到此颜色会发生变化。