使用　Semantic UI 的按钮群组，可以把功能相近的按钮组织在一起 .. 这些按钮的周围需要用一个容器包装一下 .. 可以使用一个 div ，上面要加上 ui 还有 buttons 这两个类 .. 注意这里是 buttons ，复数的形式 .. 它里面可以放一些按钮 .. button.ui.button ，需要三个这样的按钮 .. HTML .. CSS .. JavaScript ..

div.ui.buttons>button.ui.button*3

你会看到，这三个按钮就组织在了一起显示.. 第一个按钮的左边，还有最后一个按钮的右边有一个圆角效果 .. 加上一个 basic 类，可以把改变这个按钮组里的按钮的样式 .. 复制一段 .. 在按钮组的包装上添加一个 basic .. ui basic buttons .. 这里就不需要把 basic 类添加到每个按钮上，只需要放到这个容器上就行了 ..

现在按钮没了背景，只会显示一个灰色的边框 ..

如果你想让这个按钮组里的按钮等分容器的宽度显示 .. 在这个按钮组容器的上面，可以加上表示等分份数的 CSS 类，比如在这个按钮组里有三个按钮，等分宽度的话就需要分成三份，所在这个容器上要加上一个 three .. 等分成两份就加上一个 two .. 等分成四份就加上一个 four ..

在按钮组容器上加上一个 vertical .. 可以让这个按钮组垂直显示 ..

按钮组的容器上还可以使用表示颜色或者大小的 CSS 类 .. 比如要把按钮变成绿色的，可以加上一个 green … 再复制一份 … 在这个容器上加上一个 large .. 这样按钮组里的按钮会变成大号的 ..

按钮组里的按钮可以是一些小图标 .. 需要在这个按钮组的容器多加一个 icon 类 .. 这些图标按钮上也可以加上标签 .. 这样你需要在容器上再加一个 labeled ..

div.ui.labeled.icon.buttons*3

再添加几个带标签的小图标按钮 ..

可以在这个按钮组的容器上再用一个 vertical ，这样会让这个按钮组垂直显示 ..