EXTJS 4.2 и цвет заголовка сетки

Question

Я не могу найти способ отображения заголовка сетки (но не простого заголовка) в определяемом мной шрифте и цвете фона. Ситуация следующая: - У меня есть сетка с колоннами, как это:

----------------------------------------- 
    |    name    | 
    --|-----------------------------------|-- 
    |  part 1  |  part 2  | 
    --|-----------------------------------|-- 
    | p1 | p2 | p3 | p1 | p2 | p3 | 
    --|-----------------------------------|-- 

• Я должен отображать поле только основной заголовок («имя») в специальном цвете на специальном фоне, давайте говорят, белый на красном

• в основной колонке («имя») определение я поставил стиль: (для цвета шрифта) ЦБС: (для определенных в CSS файл, цвет фона)

И я могу установить цвет шрифта для каждого «уровня» заголовков по-другому, как я хочу, но цвет фона все равно работает для всех заголовков.

Будьте так добры и скажите мне, почему ?:

Answer 1

Проблема заключается в том, что структура рисует заголовки сетки в виде вложенных DIV-х и подзаголовки имеет прозрачный фон, и, следовательно, принимать фон родительского элемента (в отличие в таблицу HTML, в которой такая группировка выполняется с помощью свойства colspan, и каждый заголовок является отдельным td/th элементом).

Я могу предложить два решения для этой задачи:

1. Добавить cls в столбце

   { 
       text: 'Contact Info', 
       cls: 'customGridHeader', 
       columns: [ 
        { 
         text: 'Email', 
         dataIndex: 'email' 
        }, 
        { 
         text: 'Phone', 
         dataIndex: 'phone' 
        } 
       ] 
   } 
   

   и с помощью CSS прямого выбора детского добавить необходимые стили для колонки внутреннего DIV

   .customGridHeader > .x-column-header-inner { 
       background: red; 
       color: white; 
   } 
   

   Fiddle

2. Добавить цвет заголовка таблицы через styles, но вы должны добавить цвета в подзаголовки как хорошо (вы можете использовать defaults attribture применить стиль для всех дочерних компонентов)

   Fiddle