hoverを指定したのに変わらない

HTML+CSSの勉強をしている人から「a:hoverを指定したのに変わらない」という質問を頂いた。
結果的には単純ミスだったんだけど、コードをみてもすぐに間違いに気付けなかったので記録。

質問者のコードは以下

#page-top a {
    background-color: #000000;
    transition: all 500s;
}
#page-top a:hover {
    background-color: #666666;
}

お恥ずかしながら、自分はこれをみてすぐに問題に気付くことができず
background-color: #ff0000;とか値を極端に変えてちゃんとスタイルが効いているのかデバッグしたりしていた。（これ見てる人はすぐわかるのかな…）

原因は「transition: all 500s;」で、500sは 500秒。
8分半かけてアニメーションしているから変わっていない様に見えたんですね。。

下記の様に、「transition: all 500ms;」に切り替えて解決。

#page-top a {
    background-color: #000000;
    transition: all 500ms;
}
#page-top a:hover {
    background-color: #666666;
}

無事、500ms（0.5秒）でアニメーションし 質問者がしたかった変化が実装できました。

msが何なのか説明してくれない教材で勉強をしていたようで、納得できた模様。