html - 超链接标签事件状态不工作

Question

每当我尝试使用超链接/ anchor 标记事件状态时，它都不起作用。即使我点击链接，它应该显示为处于事件状态，但没有任何效果。有什么我想念的吗？

这是一个基本的例子-

html:

             <ul>
                <li><a class="main" href="">Home</a></li>
                <li><a href="">About</a></li>
                <li><a href="">Contact</a></li>
                <li><a>Search</a></li>
                <li><a href="">RSS Feed</a></li>

             </ul>   

         </div>

CSS:

#navigation ul li  a:hover, #navigation ul li  a:focus, #navigation ul li  a:active  {
                color: #FFF;        
                border: 1px solid #B20000;
                border-top: 2px solid #B20000;
                padding: 15px 6px 6px 6px;
                background: #660000;
                -moz-transition: color 1s ease; 
                -o-transition: color 1s ease; 
                -webkit-transition: color 1s ease; 
                transition: color 1s ease;      
                text-shadow: 0 0 0.2em #D5E3E7, 0 0 0.2em #D5E3E7;

        }

Answer 1

没有效果，因为您为链接的两种状态使用了相同的 CSS 样式:

a:hover
a:active

你应该给他们设置不同的CSS样式，才能看到样式的变化。例如:

#navigation ul li a{
  color:#0000ff;
}

#navigation ul li a:hover{
  color:#ff0000;
}