1. 程式人生 > >extjs-grid修改行 列的顏色

extjs-grid修改行 列的顏色

               

修改選中行的顏色就可用如下設定完成:

.x-grid3-row-selected{background:#c6e2ff!important;}

-----------在ext-all.css修改程式碼如下---------

.x-grid3-row {

border-color:#ffaaee;//改變grid邊框顏色

border-top-color:#fff;

}

.x-gid3-row-alt{

background-color:#ddeeaa;//改變 行的顏色

}

.x-grid3-row-over {

border-color:#ddd;

      background-color:#ee1166;//滑鼠移上去改變行的底色

      background-image:url(../images/default/grid/row-over.gif);

}
給grid一列加著色
1、這個為columnModel中的idaorD
   .x-grid3-col-aorD {
      background: #bde0e8
   }
2、css程式碼
.x-grid-back-red {
     background: #FF0000;
}
.x-grid-back-red {
   background: #FF0000;
}
Js程式碼
{
             header : '分成型別',
             dataIndex : 'divideType',
             renderer : function(v,m){
                 m.css='x-grid-back-red';
                return v;
             },
             width : 60
         }
{
           header : '分成型別',
           dataIndex : 'divideType',
           renderer : function(v,m){
               m.css='x-grid-back-red';
               return v;
           },
           width : 60
       }
3、
或者直接這樣寫也可以
Js程式碼
{
             header : '編號',
             dataIndex : 'fcId',
             css : 'background: #FF0000;',
             width : 40
         }
{
           header : '編號',
           dataIndex : 'fcId',