我在專案中遇到的一些知識點：

1.在GridPanel中顯示圖片，效果

對應的程式碼實現

 {
                    text: '是否啟用',
                    width: 80,
                   // xtype: 'checkcolumn',
                    dataIndex: 'IsEnabled',
                    renderer: function boolFromValue(val) {

                        if (val) {
                            return '<img src=../../Content/images/true.png>'
                        }
                        else {
                            return '<img src=../../Content/images/false.png>'
                        }
                    }
 

2.隱藏panel的標題欄

這個很簡單，直接把

 header: false,

3.調整Extjs中的所有字型的大小

• 只需把ext-all.css樣式檔案中的所有11px換成12px，這樣就為統一的12px的字型了。

但是如果再想增大,那麼這時候不光是把原始檔的11px換成15px，而且需要把裡面和font有關的12px換成15px。

改完之後按鈕出現毛邊,在樣式檔案中加

.ext-ie .x-btn-text-icon .x-btn-center .x-btn-text {   
    padding:3px 0px 0px 0px; 
} 

毛邊就不見了!

• 由於在不同瀏覽器中，或者不同版本的同款瀏覽器中顯示的Extjs字型大小不一樣。而且看起來比較小。不順眼。

在網上查之，獲得一條有用資訊：Extjs 在很多情況下使用 11px 字型，11px 大小是一種邊緣字型，不同的瀏覽器對 11px 的渲染各不相同，IE 的渲染和12px 相似，而在 Firefox 中，則和 10px相似，導致字型在FF 中過小的問題。 為了能夠徹底的解決字型大小問題，直接開啟ext-all.css，查詢所有的11px並替換為12px。問題解決了

上網找了好多資料，都說是加上

.x-btn-text{
 font-size:15px;    
}  

這樣就好了，但是在IE9和FF下還是不好用。

後來到ext-all.css裡慢慢試，才找到設定的地方。

把如下程式碼放到別的css裡引用就行了：

.x-btn-text-icon .x-btn-icon-small-left .x-btn-text{
    background-position: 0 center;/*預設*/
    background-repeat: no-repeat;/*預設*/
    padding-left:18px;/*預設*/
    height:16px;/*預設*/
    font-size:15px;/*字型大小設定*/
}

4.相對應的，調整了字型大小，tabpanel的標題就會被遮擋住一部分，問題就出來了，怎麼調整tabpanel的tab標題：

tabBar : {
        height : 28,
        defaults : {
            height : 28
        }
    },

暫時總結這麼幾個，隨後我會繼續新增