先添加一个标题分隔 ..

h2.ui.dividing.header{Button}

任何元素都可以成为按钮，不过一般常用的就是 a 标签，还有 button 标签 .. 我们先试一下用一个 div 标签 .. 在上面应用 Semantic UI 的按钮的样式，需要先用一个 ui 类，接着是一个 button 类 ..

div.ui.button{按钮}

这里会显示一个默认的按钮样式 .. 再把这个 div 换成 a 标签 .. 同样会显示一个按钮 ... 再试一下 button 标签 .. 一样看起来是个按钮 ... Semantic UI 不太关心你具体用什么标签 ...

我们可以使用一些表示大小的英文单词来控制按钮的尺寸 .. command + shift +D 复制一下这行代码 .. 这里先用一个 mini .. 保存 .. 这种按钮会比一般的按钮小一些 .. 再试一下 tiny .. 它比 mini 略大一点点 .. 不过在浏览器上对比不太明显 .. 然后是 small ，表示小号的按钮 .. 中号按钮是 medium ui button .. 大号的按钮可以用一个 large .. 比它再大一点的是 big ui button .. 比大更大的是 huge ... 最大的尺寸的按钮是 massive ui button ..

添加一个分隔 ..

div.ui.divider

你想让按钮跟它的容器一样宽，可以用一个 fuild ..

button.ui.fluid.button{加载更多...}

（#改变页面宽度）现在这个按钮的宽度会随着它的容器的变化而变化 ..

再试一下其它类型的按钮 .. 在按钮上也可以有主次 .. 比如你可以在主要的按钮上添加一个 primary 类 .. ui primary button .. 意思就是这是一个主要的按钮 .. 你会看到这个按钮会应用一个特别的样式，你可以定制 Semantic UI ，把这个主按钮换成自己的颜色 ..

button.ui.primary.button{主按钮}

次要的按钮上，要用一个 secondary .. ui secondary button ..

button.ui.primary.button{次按钮}

默认这个次要的按钮是黑色的背景 .. 按钮还可以有正面跟负面，比如表示确定的按钮可以用一个正面按钮，取消可以用一个负面按钮 .. 在正面按钮上用一个 positive .. 然后是 ui .. 最后是 button .. 按钮上的文字是 确定 ..

button.ui.positive.button{确定}

默认它的背景颜色是绿色的 .. 再添加一个负面按钮 .. 要使用一个 negative .. button.ui.negative.button{取消} .. 表示负面的按钮是一个红色的背景 .