Css 锚点和常规链接-样式

在我正在构建的网页中，我使用锚来轻松导航。IE6中这些锚的样式给我带来了一些麻烦

<div class="text">
    <h3><a class="anchor" name="custom_name">Title</a></h3>
    Lorem ipsum <a href="otherpage.aspx">dolor</a> sit amet.
</div>

在FF和IE7+中，没有问题。但在IE6中，链接是白色的（如正文选择器中定义的），因为它与.text a[href]有问题。当我删除[href]时，所有浏览器中的锚都会变成红色（自然）。在firefox中，悬停仍然会产生效果，但在IE中不会

在FF和IE6中，有没有一种方式可以使锚定的样式不同于常规链接？显然，课堂“锚”帮不了什么忙

编辑-对不起，这是我想要的：

---

所有常规链接必须为红色（href）。所有锚固件必须为h3颜色，灰色。当我将鼠标悬停在一个常规链接上时，它会加下划线，而将鼠标悬停在其中一个锚点上几乎不会改变任何内容。

尝试使用

.text>a

点击第二个链接。它只会直接命中

.text

类的子类。

有

a:link

：

a { /* styles for all anchors */ }
a:link, a:visited { /* styles only for links */ }
a:hover { /* styles that should only apply to hovered links (not anchors) */ }

放弃“锚”类。。。我想你想要的是：

.text 
{
    color: #000;
}

.text a
{
    color: #ea2026; /*red*/
}

.text h3 a, .text h3 a:hover
{
    color: #a9a18c; /*gray*/
    text-decoration: none;
}

替换：

<h3><a class="anchor" name="custom_name">Title</a></h3>

标题

与：

标题

它较短，不会与用于链接的样式混淆

（或者，看看

a:link:hover，a:visted:hover{}

，但我不知道IE在选择器的单个部分上支持多个伪类是什么样子的）

两件事：

添加锚元素而不给它一个id不会使导航更容易。它也不太可能是有效的。我想你想要的是有指向h3 ID的锚。比如：

<div class="linktotext">
<a href="#title1">Title</a>
</div>
<div class="text">
    <h3 id="title1">Title</h3>
    Lorem ipsum <a href="otherpage.aspx">dolor</a> sit amet.
</div>

---

你到底想要什么如果你能用一两句话总结一下你对颜色/效果的需求，那会有帮助。示例：“最终，我希望所有的锚都是红色的，但如果它们没有a href，我希望它们是紫色的”-或其他：）同意，不清楚您想要实现什么。当你有锚类时，为什么你需要[href]位？使用[href]而不是重新分类你的锚是好的（我很清楚），但我只想知道你想要什么作为颜色和风格的最终结果。。。然后我们可以写任何浏览器，最好的CSS的工作。感谢澄清。。。这就是我想的。请看下面我的回答（不需要时不要添加任意类：P），我认为您100%没有抓住要点。。。他希望在页面中添加锚，以便导航。。。去掉“a”标签会有什么帮助？令人惊讶的是，这确实有效。带有id的h3标签可以链接到。。。因此，这确实是一个干净得多！从不知道：）我想记录下我的话：）对不起，这和.text a选择器没什么不同。宾果，就是它。我没有看到使用h3作为选择器的选项。。。谢谢：）有趣的功能，这个。遗憾的是，这并不能解决这个问题，但我确实学到了一些新的东西：）谢谢！是的，我后来意识到你真正想要的是什么。但我想我还是让答案留在这里。不过很高兴你喜欢它（：

<h3 class="fragment" id="custom_name">Title</h3>

<div class="linktotext">
<a href="#title1">Title</a>
</div>
<div class="text">
    <h3 id="title1">Title</h3>
    Lorem ipsum <a href="otherpage.aspx">dolor</a> sit amet.
</div>

.text 
{
    color: #000;
}

.text a
{
    color: #ea2026;  //red
}

.text h3 a, .text h3 a:hover
{
    color: #a9a18c;  //gray
    text-decoration: none;
}