CSS :link 选择器CSS element,element 选择器

CSS :link 选择器

定义

:link 选择器用于为未被访问的链接（超文本引用）设置样式。它仅适用于 HTML 中的 <a> 标签，当用户尚未单击该链接时应用样式。

语法

a:link {
  /* 样式声明 */
}

示例

<a href="example.html">未访问过的链接</a>

a:link {
  color: blue;
  text-decoration: none;
}

以上代码将为未访问过的链接设置以下样式：

• 蓝色文本
• 无下划线

用法

:link 选择器通常用于：

• 为未访问过的链接提供默认样式
• 与其他链接状态选择器（如 :visited、:hover 和 :active）结合使用，以创建交互式链接效果
• 在导航菜单或侧边栏中区分未访问过的链接

注意事项

• :link 选择器仅适用于未被访问过的链接。如果用户单击了链接，它将不再受到此选择器的影响。
• :link 选择器的优先级低于其他链接状态选择器，如 :visited 和 :hover。这意味着，如果同时使用多个选择器，优先级较高的选择器将覆盖优先级较低的选择器。
• 在现代浏览器中，:link 选择器的支持非常广泛。然而，在较旧的浏览器中，它可能不被支持。

CSS element,element 选择器

定义

element,element 选择器用于为相邻的多个元素设置样式。它将样式应用于第一个元素，然后应用于紧随其后的所有元素。

语法

element1, element2 {
  /* 样式声明 */
}

示例

<p>段落 1</p>
<p>段落 2</p>

p, p {
  color: red;
  font-size: 1.2rem;
}

以上代码将同时为两个段落设置以下样式：

• 红色文本
• 1.2rem 字体大小

用法

element,element 选择器通常用于：

• 为相邻的元素组设置相同的样式
• 创建项目符号或编号列表
• 在表格中设置行或列样式

注意事项

• element,element 选择器仅适用于相邻的元素。如果两个元素之间有其他元素，则此选择器将不会应用样式。
• element,element 选择器的优先级低于其他选择器，如类选择器和 ID 选择器。这意味着，如果同时使用多个选择器，优先级较高的选择器将覆盖优先级较低的选择器。
• 在现代浏览器中，element,element 选择器的支持非常广泛。然而，在较旧的浏览器中，它可能不被支持。