如何在其他元素中设置样式链接

Question

我有这个结构

<nav>
  <ul id="nav" class="sf-menu sf-navbar sf-js-enabled sf-shadow">
  <li id="level1-home" class="current sfHover sf-breadcrumb">
     <a href="/Admin/Home/Index">
  ...

我想在不影响网站中任何其他链接的情况下设置<a>代码的样式。最好的方法是什么？

Answer 1

nav a { /*affect only links in the navbar */ }

Answer 2

按ID

定位

在您提供的代码中，id元素上有ul“nav”。这可用于指定您要定位的锚点的容器：

#nav a {
  color: orange;
}

这将影响（{无）嵌套深度内的所有a个元素，其元素的{“1”}为“导航”。

按唯一路径定位

检查链接的父级是否具有唯一性。属于id元素的nav元素内的链接可以是这样的样式：

header

header nav a { color: red; } 中包含的nav内的链接可以像这样解决：

footer

声明

footer nav a { color: green; } ，header和footer标记都是HTML5结构。要在旧版浏览器中获得广泛支持，请务必在使用这些代码时添加HTML5Shiv。