风格

应用程序样式是指用户调整组件的外观和感觉。这些调整可能包括:颜色，颜色渐变，字体，边距/填充等。Ext JS 6有一种新的应用程序样式。

它使用SCSS的样式。 SCSS是编写CSS代码的更动态的方式。我们可以在这个帮助下在我们的样式表中写入变量。但是浏览器不能理解SCSS它只能理解CSS，所以所有的SCSS文件应该被编译成CSS生产就绪代码。

这就是为什么SCSS文件被称为预处理器文件。在Extjs中，编译通过Sencha CMD工具完成。

Sencha CMD手动编译它一次使用命令如下:

sencha应用程序构建[开发]

全局CSS是主要的CSS文件，它具有所有的SCSS变量与ExtJS相关联，我们可以在我们的应用程序中使用它来定制我们的主题，根据我们的需要提供不同的价值。

Extjs中的Global_CSS中提供的一些CSS变量:

变量	描述
$ base-color $ base-color:color （例如$ base-color:＃808080）	这个基色在整个主题中使用。
$ base-gradient $ base-gradient:string（例如$ base-gradient:\'matte\'）	在整个主题中使用的基本渐变。
$ body-background-color $ body-background-color:color （例如$ body-background-color:＃808080）	应用到body元素的背景颜色。如果设置为transparent或\'none\'，将不会在body元素上设置背景颜色样式
$ color $ color:color （例如$ color:＃808080）	要在整个主题中使用的默认文本颜色
$ font-family $ font-family:string（例如$ font-family:arial）	在整个主题中使用的默认font-family。
$ font-size $ font-size:number （例如$ font-size:9px）	要在整个主题中使用的默认字体大小。
$ font-weight $ font-weight:string / number （例如$ font-weight:normal）	在整个主题中使用的默认字体权重
$ font-weight-bold $ font-weight-bold:string / number （例如$ font-weight-bold:bold）	粗体字体的默认字体粗细在整个主题中使用
$ include-chrome $ include-chrome:boolean （例如$ include-chrome:true）	True以包含Chrome特定规则
$ include-ff $ include-ff:boolean （例如$ include-ff:true）	True包含Firefox特定规则
$ include-ie $ include-ie:boolean （例如$ include-ie:true）	True包括IE9和更低版本的Internet Explorer特定规则
$ include-opera $ include-opera:boolean （例如$ include-opera:true）	True包含Opera特定规则
$ include-safari $ include-safari:boolean （例如$ include-safari:true）	True包含Opera特定规则
$ include-webkit $ include-webkit:boolean （例如$ include-webkit:true）	True包括Webkit特定的规则

风格

风格

Extjs中的Global_CSS中提供的一些CSS变量:

选择支付方式：