在介绍定制主题前，我们先来看下Operamasks的主题使用机制。Operamasks的最终渲染结果是使用CSS层叠样式表来定义展现效果的。观察任意一个OperaMasks3.2渲染页面的源代码， 我们可以在<head>部分看到类似这样的代码：
<link class="x-skin" rel="stylesheet" type="text/css" href="/bpdemos/_global/resource/ext/resources/css/ext-all.css"/>
<link class="x-skin" rel="stylesheet" type="text/css" href="/bpdemos/_global/resource/om/resources/skin/default/css/om-ext-all.css"/>如果应用本文第2节介绍的方法设置页面的当前主题为gray，则在上述两个<link>标签下面我们还能看到一个<link>标签。
<link class="x-skin" rel="stylesheet" type="text/css" href="/bpdemos/_global/resource/ext/skin/gray/yuiext/css/xtheme-gray.css"/>
Operamasks将gray主题的<link>标签放在引入默认风格的<link>标签之后，从而保证gray主题覆盖默认主题。应该注意的是，这里引入的是应用部署后创建的样式表副本。 原始文件在operamasks-comp.jar的META-INF\ resource\ ext\ skin\ default\ yuiext\ css\与META-INF\ resource\ ext\ skin\ gray\ yuiext\ css\目录下。 通过观察这些主题文件，可以对Operamasks中主题的使用有一个整体印象（例如命名规则，默认标签风格等）。在实际应用中，用户常常需要对这些主题进行简单的修改和扩展，但由于这些主题资源是Operamasks发行包的一部分，所以用户不应该直接修改这些文件，否则随着Operamasks版本的更新，用户所作的修改会被覆盖。
因此，用户可以自己定义一套主题，主题资源配置完成后，按照如下目录结构进行放置.
META-INF
-----resoure
----------ext
-------------skin
----------------greenskin
-------------------yuiext
----------------------css
-------------------------xtheme-greenskin.css
----------------------images
----------skins.xml然后配置skins.xml文件。skins.xml的内容如下：
<skins>
<skin id="greenskin" file="ext/skin/greenskin/yuiext/css/xtheme-greenskin.css">
<displayName><![CDATA[Greenskin]]></displayName>
<displayName locale="zh_CN"><![CDATA[Greenskin]]></displayName>
<authorName><![CDATA[Ext JS - JavaScript Library]]></authorName>
<authorEmail><![CDATA[jack.slocum@yahoo.com]]></authorEmail>
</skin>
......
</skins>最后将主题资源打成Jar包放在应用的lib目录下即可。下面将以一个简单的例子来说明主题的定制过程。这里我们需要借助于FireFox的插件FireBug来获取页面元素的class属性值。 我们的需求是修改TabLayout的展示风格。
首先，使用FireBug的Inspect（查看）功能，找到tab页签条的样式。
在FireBug中可以看到这个元素的CSS样式。
上图右边的Style窗口中可以看到所有影响当前元素并且已作定义的class，以及样式定义之间的覆盖关系。找到ul.x-tab-strip-bottom，由于我们希望改变tab页签条的背景，所以需要修改background属性。
接着编写新主题的样式文件xtheme-greenskin.css。
ul.x-tab-strip-bottom{
background-image:url(../../images/ext/green/tabs/tab-strip-btm-bg.gif);
border-color:#91ceb9;
}然后配置skin.xml，配置内容在上文中已经介绍了。最后将所有的主题资源打包放入应用的lib目录下。
应用本章第2节介绍的方法，修改页面主题为Greenskin。重启应用，再来查看该元素css样式的加载情况。
由上图可以看到xtheme-greenskin.css被加载，tab页签条达到预期效果，新主题定制成功。
