ExtJS - 更改默认按钮样式和字体答案

【问题标题】：ExtJS - Changing default button styles and fontsExtJS - 更改默认按钮样式和字体
【发布时间】：2013-07-10 14:29:45
【问题描述】：

我有这个要求，我必须更改我的 Ext JS 应用程序的默认样式。我不是在谈论更改 CSS 文件中的内容。我还没有那么雄心勃勃。这是我正在寻找的内容：

假设我需要一个提交和取消按钮，我使用 xtype:button 和 text:Save （或 Cancel ）。这将呈现带有文本的按钮。如果我想改变按钮的外观和感觉应该怎么做？或者将按钮替换为酷炫的保存或取消图片？
现在我拥有应用程序中的所有文本，并使用 ExtJS 显示的默认字体。如果我想将应用程序上的所有文本更改为不同的字体，我应该怎么做？表单/网格中的数据和每个组件的标题中的所有内容都应该更改为我的客户喜欢的其他字体。我该怎么办？

我知道这些是非常基本的通用问题，但在继续我的任务之前，我正在寻找一个好的提示。

提前谢谢大家。等待答案:)

更新：所以，我发现了我们如何处理 CSS 和更改字体。任何人都可以帮助更改提交/取消按钮的外观。

【问题讨论】：

标签： extjs4.1

【解决方案1】：

我建议你使用SASS 和compass 来构建你自己的主题，或者更好的说法是改变一个现有的主题。在Ext JS documentation中可以找到css变量，可以根据自己的需要设置。

【讨论】：

第二个问题，我得到了答案。我可以添加一个新的 CSS 文件，并将我的首选项添加到我的应用程序中，然后将它们添加到我的视图文件中。我不想冒险使用 API 提供的 CSS 文件。我改变按钮的外观和感觉的方式是一样的吗？基本上，API 文档在网格/表单示例中显示了添加/删除等各种按钮，这些按钮看起来不错。我该如何使用它们？我在哪里可以找到它们？如何在我的组件中使用它们？
是的，方式相同——字体和“外观”在 css 类中声明。

【解决方案2】：

如果您还没有准备好使用 SASS 进行主题化，请查看 sencha 文档中的按钮配置示例：

CSS 为按钮添加自定义图像：http://docs.sencha.com/extjs/4.1.3/extjs-build/examples/button/button.css

基本上这显示了如何使用按钮配置上的iconCls 属性以及一个简单的 CSS 类来将所需的图像添加到您的按钮。

【讨论】：