css - 如何通过定位 anchor 标记内的类来更改 anchor 标记中的颜色或文本？

Question

有人可以解释为什么会发生以下情况吗:

<a href="#" class="test">Test</a>

<style type="text/css">
.test {
border: thin solid blue;
color: red;
}
</style>

这只会创建边框，但不会在使用类时将文本变为红色。

但是，这可以在使用 id 时将文本变为红色:

<a href="#" id="test">Test</a>

<style type="text/css">
#test {
border: thin solid blue;
color: red;
}
</style>

为什么类不改变文本颜色，而使用 id 却有效？

谢谢!

Answer 1

用这个

demo here

 <a href="#" class="test">Test</a>

 <style type="text/css">
a.test {
border: thin solid blue;
color: red;
}
</style>