2010-07-26 2 views
2

하이퍼 링크/앵커 태그 활성 상태를 사용하려고 시도 할 때마다 작동하지 않습니다. 링크를 클릭해도 활성 상태로 표시되어야하지만 효과는 없습니다. 내가 놓친 게 있니?하이퍼 링크 태그 활성 상태가 작동하지 않습니다.

이 기본적인 예 -에게 있습니다

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 : 당신의 두 상태에 대해 동일한 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; 

     } 

답변

2

이 원하는 효과를 달성하기 위해, 당신은 그들이 일치하는 경우 탐색 링크와 비교하고, 링크가 활성화되어있는 사이트 현명한 변수에 포함 된 값을 전달하고, 페이지로드 변수를 검색한다 그런 다음 능동적 인 수업이나 다른 것을 적용하십시오.

css의 경우 : 활성화는 정확한 순간에 푸시되는 링크를 표시하는 데 사용되며 링크는 현재 사이트가 활성 상태가 아닙니다.

PHP와 같은 서버 측 언어로 쉽게 구현할 수 있지만 클라이언트 측 언어 (예 : 자바 스크립트)로 구현할 수 있는지는 잘 모르겠다. 그것도.

3

링크 :

a:hover 
a:active 

스타일을 변경하려면 다른 CSS 스타일을 설정해야합니다. 예를 들어 :

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

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

나는 그것을 시도했다. 그것은 작동하지 않았다. 나는 내 질문에 내가 분명했으면 좋겠다. 메뉴에서 활성 링크를 클릭하면 활성 상태 스타일을 적용해야합니다. 그러나 그렇지 않습니다. 내가 그 위에 마우스를 올리면 변경 될 것입니다. 예를 들어 stackoverflow.com의 'TAG'버튼을 클릭하면 해당 페이지로 이동하게되고 주황색으로 바뀌고 나머지 링크는 회색으로 바뀝니다. 내 페이지에 이런 일은 일어나지 않습니다. – input

0

그래, 당신은 시도 발생합니다 변경 사항을 확인하기 위해 가져가 활성 상태에 대한 완전히 다른 스타일을해야 무슨 일이 일어나고 있는지 볼 수 있도록해야

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

.