CF9에서 cflayout 탭의 모양 변경

기본 모양의 cflayout 탭을 덮어 쓰려고합니다.CF9에서 cflayout 탭의 모양 변경

웹 사이트 이미지 폴더에 편집 된 배경 스프라이트를 놓으면 호버 모양을 변경할 수는 있지만 내장 된 .x-tab-strip-over 클래스를 참조하여 마우스를 가져 가면 텍스트가 흰색으로 바뀌는 것처럼 보일 수 없습니다. 액션 here

<style type="text/css"> 
    div.x-tab-panel-header, ul.x-tab-strip-top { 
     background-image: none; 
     background-color: transparent; 
     padding-bottom: 0px; 
    } 
    div.x-tab-panel-header { 
     border: 0px; 
    } 
    .x-tab-strip-active, .x-tab-strip-text { 
     font-weight: normal !important; 
     font-size: 14px !important; 
     font-family: arial !important; 
    } 
    .x-tab-strip-over { 
     color: white !important; 
    } 
    .x-tab-right, .x-tab-left, .x-tab-strip-inner { 
     background-image: url(images/xd-tabs-sprite.gif) !important; 
    } 
</style> 

<cflayout type="tab"> 
    <cflayoutarea title="Mouse"> 
     Mickey Mouse 
    </cflayoutarea> 
    <cflayoutarea title="Duck"> 
     Donald Duck 
    </cflayoutarea> 
</cflayout>

모든 단서에서

는

출처

2011-06-12 Saul

사용 평가 :

.x-tab-panel-header .x-tab-strip-over span { 
    color: white; 
} 
.x-tab-panel-header .x-tab-strip-over.x-tab-strip-active span { 
    color: red; 
}

거기에서 일어나는 많은 거기를, 그래서 일을 뭔가를 찾을 때까지 그냥 테스트.

출처

2011-06-12 14:12:09 thirtydot

네 파일 name.zip 될 것입니다, 나는 약간 더러운 수정을 느낄 수 있지만 아마도이 작업을 수행 할 수있는 적절한 방법이기 때문에 그 – Saul

는 CF9는 CF8가의 ExtJS 2.x에서를 사용하는 반면 ExtJS를 3.x를 사용

사용 방법 :

클릭 내선 테마 빌더. (내가 추천 - 회색) 상단 도구 모음에서 (청색 또는 회색)

템플릿 선택

선택 기본 색상, 헤더 색상, 배경 색상, 테두리 색상, 헤더 글꼴, 글꼴, 창 투명도, 툴셋 (기본, Vista, TargetProcess, Graphite) 및 ExtJS 버전입니다. 선택하지 않은 테두리 색상을 클릭

이 테마의 이름을

다운로드를 클릭 테마를 입력 적용 기본 색상

에 따라 자동으로 할당 됩니다. 그것은 xtheme-테마

http://extbuilder.dynalias.com/springapp/mainpage.htm

출처

2011-06-12 15:27:00 Henry

+1 :-)를했다. – thirtydot

CF9에서 cflayout 탭의 모양 변경

답변

관련 문제