2012-03-19 5 views
1

페이지를 선택하면 어떻게 메뉴 색을 변경할 수 있습니까?메뉴 막대에서 현재 페이지 강조 표시

예 : 나는 메뉴 바에서 선택된 페이지를 표시 할

홈 자주 묻는 질문 contact_us. 나는 CSS를 사용하고 있지만 이것에 대해 어떻게할지는 모르겠다.

내 CSS 코드 :

.menu { 
    float: left; 
    margin: 0px 0 0 0; 
    width: 1000px; 
    } 
    .menu li { 
    border-left: 1px solid #fff; 
    float: left; 
    line-height: 1em; 
    text-align: center;} .menu li a { color: #fff; 
    display: block; 
    font: 17px Arial, Helvetica, sans-serif; 
    padding: 0px 31px;  
    line-height:47px; 
    text-decoration: none; 
     } 
    .menu li a span {display:block; padding:0px 15px;} 
    .menu li a:hover, .menu .active a{color:#fff; 
    background:#ed1f26 url(images/menuleft.jpg) left top no-repeat; 
    width:auto; 
    } 
    .menu li a:hover span, .menu .active a span 
    {background: url(images/menuright.jpg) right top no-repeat; 
    padding:0px 14px; 
    border:1px solid #b3c302; 
    } 
+0

메뉴를 하드 코딩 했습니까, 아니면 번역을 사용합니까? –

+0

난 그냥 내 CSS를 추가, 그 페이지에 활성화 된 – ruby

+0

그 물건에 대한 모든 메뉴 탭 모듈을 사용 했어. – Rafee

답변

2

글쎄, 당신은 각 페이지에 메뉴를 작성하는 경우 (귀하의 의견의 경우 것으로 보인다) 특정의 배경색을 변경을 중지 아무것도 없다 <li>과 관련된 페이지

현재 페이지 (홈)의 흰색 배경 또는 비활성 페이지의 기본 색상을 보여주는 아래의 예.

<li style="background-color:rgb(255,255,255);">Home</li> 
<li>FAQ</li> 
<li>Contact Us</li> 

는 또한 몇 가지 스크립트를 사용하고 난이 바이올린에서 수행 한 것처럼 탭을 만들 수 있습니다 : 당신이 돈으로 각 페이지에 너무 많은 내용이없는 경우 http://jsfiddle.net/gstubbenhagen/zAbmA/

난 단지 탭을 추천 할 것입니다 느린 연결에서 영원히로드하는 매우 큰 페이지를 1 개 만들고 싶습니다.

참고 : 제공되는 예는 jQuery 플러그인을 사용하여 탭 옵션을 사용하여, 당신은 다시 코드를하지 않을 경우 같은 도구를 추가 있는지 확인합니다.

관련 문제