2

ExtJS4 は初めてです。ExtJs4 Docs でいくつかの簡単なデモをテストしています。パネルのヘッ​​ダーは常にパネルの本体よりも少し小さく、パネルの内側も小さいことがわかりました。ヘッダーは、Firebug を使用したメジャーの下のボディよりも常に 11px 短くなります。私はFF、IE8、Chromeでコードをテストしましたが、それらはすべてスクリーンショットが示すようにレンダリングされます(画像リンク)。下手な英語でごめんなさい。この問題で混乱しています。助けてください。

スクリーンショットのリンク:

http://i.stack.imgur.com/vb2Xo.jpg

                or

http://www.tu265.com/di-c870adf0409aa61a99c774186dd9afa8.jpg

私のjsコード:

Ext.create('Ext.panel.Panel', {
    title: 'container panel',
    renderTo: 'container',
    width: 400,
    height: 300,
    layout: 'accordion',
    items: [{
        tools: [{ type: 'gear', handler: function () {
            Ext.Msg.alert('msgWindow', 'btn is Clicked');
        }
        }, { type: 'refresh'}],
        title: 'panel1',
        xtype: "panel",
        html: "insidePanel1"

    }, {
        title: 'panel2',
        xtype: "panel",
        html: "insidePanel2"
    }, {
        id: 'panel3',
        title: 'panel3',
        xtype: "panel",
        html: "insidePanel3"
    }]
});
Ext.create("Ext.Button", {
    renderTo: 'container',
    text: "open panel3",
    handler: function () {
        Ext.getCmp('panel3').expand(true);
    }
});

html コード:

<html xmlns="http://www.w3.org/1999/xhtml" >
<head runat="server">
<title>Layouts</title>
<link href="../../ext-4.0.7-gpl/resources/css/ext-all.css" rel="stylesheet" type="text/css" />
<script src="../../ext-4.0.7-gpl/ext-all-debug.js" type="text/javascript"></script>
</head>
<body>
<div id="container"></div>
<script type="text/javascript">
//js code
</script>  
</body>
</html>
4

3 に答える 3

1

あなたのコードは私の PC (FF、IE 8、および Chrome) で正常に動作します。したがって、いくつかの方法で試すことができると思います。

  • ext-all-gray.cssまたはext-all-access.css代わりにext-all.css。
  • ext-all.jsの代わりにext-all-debug.js。
  • ext-4.0.7-gplSencha サイトから再ダウンロードします。
于 2012-04-17T08:07:05.633 に答える
0

私も似たようなものがあります。scopeResetCSS = falseに設定してみてください。デモの例が付属している場合もあるので、コメントしてください。

//Ext.scopeResetCSS = true;
于 2012-04-16T20:04:21.357 に答える
0

たとえば、独自のcssファイルと次のようなルールを使用できます

.x-panel-body .x-panel-header-text{
    font-size:12px;
    font-weight:bold;
}​

実際の例を見てみましょう

于 2012-04-15T07:53:43.757 に答える