Блог

Я пытаюсь переопределить внешний вид вкладок cflayout по умолчанию.

Поместив отредактированный фоновый спрайт в папку изображений веб-сайта, я могу изменить внешний вид при наведении курсора мыши, но, похоже, я не могу заставить текст становиться белым при наведении курсора мыши, ссылаясь на встроенный класс .x-tab-strip-over.

В действии здесь

     <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>
  

Любые подсказки приветствуются

CF9 использует ExtJS 3.x, в то время как Cf8 использует ExtJS 2.x

Как использовать:

1. Нажмите Ext Theme Builder.
2. Выберите шаблон (синий или серый) на верхней панели инструментов (я рекомендую — серый)
3. Выберите базовый цвет, цвет заголовка, цвет фона, цвет границы, шрифт заголовка, шрифт, прозрачность окна, набор инструментов (по умолчанию, Vista, TargetProcess, Graphite) и версию ExtJS. Невыбранный цвет границы будет назначен автоматически в соответствии с базовым цветом
4. Нажмите Применить
5. Введите название темы
6. Нажмите Загрузить тему. Это будет xtheme-тема name.zip файл

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

Использовать:

 .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;
}
  

Там много чего происходит, поэтому я просто тестировал, пока не нашел что-то, что сработало.