Semantic UI 给按钮提供了几个默认的主题， Default Classic Basic Bootstrap3 Twitter Raised Chubby Round Amazon Material Github .. 你可以使用这些主题重新编译生成 Semantic UI ..

先打开命令行工具 .. 进入到 Semantic 所在的目录 .. cd semantic .. 然后执行一下 gulp watch .. 这样当文字发生变化的时候，会自动编译 Semantic UI ..

回到编辑器 .. 打开 src 下面的 theme.config .. 在这里你可以配置 Semantic UI 的不同组件使用的主题 .. @button 就是定义按钮主题的这个变量 .. 现在是 default ，表示使用默认的主题 ..

我们可以先试一下 Material .. 保存 .. 这样会重新编译 Semantic UI 的 CSS .. 现在，页面上显示的就是使用了 Material 主题的按钮的样式 ..

再试一下 chubby .. 把按钮的主题的名字修改成 chubby .. 保存 .. 现在页面上的按钮会用 chubby 这款主题的样式 .. 这款主题的按钮的内边距会比默认的大一些 ..

最后再试一下 raised ..

按钮会变大 .. 并且按钮的最下边会有一个阴影的效果 ..

tree src/themes -L 1