超链接在悬停或访问时不会改变颜色

Question

这是我的HTML的一部分。当您将鼠标悬停在超链接上时，超链接不会改变颜色，即使我将它们编码为。你知道为什么不知道吗？

<div class = 'container' >
                    <header> name goes here Illustration</header>
                <nav>
                    <!-- Site navigation menu -->
                    <ul>
                        <li><a href = 'index.html'>home</a></li>
                        <li><a href = '#'>film & Game </a></li>
                        <li><a href = '#'>sketchbook</a></li>
                        <li><a href = '#'>paintings</a></li>
                        <li><a href = 'contact.html'>contact/Info</a></li>
                    </ul>
                </nav>

                <!-- Main content -->
                <div  id='content' > </div>


            </div>

这是我的CSS的一部分

a:      link{
    color:              white;
    font-size:          40px;
    font-family:        Modern No. 20;
    text-decoration:    none;

    }

a: visited{
    color:          yellow;
    font-size:      20px;
    font-family:    Modern No. 20;
    text-decoration:    none;
    }

a:  hover{
    color:  blue;
    text-decoration:    underline;
}

Answer 1

您需要删除a:和link之间的空白区域，即：

a:link{
    color:              white;
    font-size:          40px;
    font-family:        Modern No. 20;
    text-decoration:    none;

    }

a:visited{
    color:          yellow;
    font-size:      20px;
    font-family:    Modern No. 20;
    text-decoration:    none;
    }

a:hover{
    color:  blue;
    text-decoration:    underline;
}