更改網格

Question

的邊界我有以下我創建網格

var store = Ext.create('Ext.data.ArrayStore', { 
    fields: [ 
    { name: 'company' }, 
    { name: 'price', type: 'float' }, 
    { name: 'change', type: 'float' }, 
    { name: 'pctChange', type: 'float' } 

], 
    data: myData 
}); 
var grid = Ext.create('Ext.grid.Panel', { 
    store: store, 
    renderTo: 'divGrid', 
    columns: [ 
    { text: 'Company', 
     flex: 1, 
     dataIndex: 'company' 
    }, 
    { text: 'Price', 
     flex: 1, 
     dataIndex: 'price' 
    }, 
    { text: 'Change', 
     flex: 1, 
     dataIndex: 'change' 
    }, 
    { text: '% Change', 
     flex: 1, 
     dataIndex: 'pctChange' 
    }], 
     height: 250, 
     width: '100%', 
     title: 'Array Grid', 
     renderTo: 'grid-example', 
     viewConfig: { 
      stripeRows: true 
     } 
    }); 

}); 

我想改變顏色和邊框格的寬度代碼。我該怎麼做 ？

Answer 1

快速和骯髒的，你可以設置此配置上繪製一個盒子任何網格或任何真正的組件：

style: 'border: solid Red 2px' 

更正確的方法是創建一個CSS規則，並在配置設置cls:'myRedBorderRule「。

編輯：

var grid = Ext.create('Ext.grid.Panel', { 
    store: store, 
    renderTo: 'divGrid', 
    style: 'border: solid Red 2px', 
    ..... 

Answer 2

ExtJS Grid Panel類爲您提供了定義自定義樣式的參數。您可以使用下面的類參數：

• 邊境
• bodyStyle
• bodyCls
• bodyBorder
• bodyPadding

您可以使用這些參數的組合來操縱網格邊框和正文樣式。有關這些參數的詳細信息，請參閱文檔。