为什么这些背景颜色没有变化？

Question

我设置了以下样式，以便可以在一些链接周围添加一个漂亮的框：

.btnRound {
text-align:center;
display:block;
margin:40px auto;
-moz-border-radius:8px;
-webkit-border-radius:4px;
border-radius:8px;
line-height:80px;
height:84px;
width:260px;
font-size:1.1em;
color:#fff;
border-color:#ddd;
border-style:solid;
border-width:2px;
cursor:pointer;
text-decoration:none;
}

然后我设置单独的颜色类别，以便为链接框设置不同的背景颜色：

.bgBlue { background-color:#09F; }
.bgPurple { background-color:#63F; }

我的HTML是：

<a class="btnRound bgBlue" href="test">Ducks CLICK HERE</a>
<a class="btnRound bgPurple" href="test">Geese CLICK HERE</a>

结果是每个背景色都是白色。为什么会这样，如何获得我想要的结果？

感谢您的时间和帮助。