默认按钮 Default Buttons

按钮示例 Sample Buttons

<input type="button" value="button"/>
<input type="button" class="h-2" value="button" />
<input type="button" class="h-3" value="button" />
<input type="button" class="hs ws" value="button" />
<input type="button" class="hm wm" value="button" />
<input type="button" class="hl wl" value="button" />
<input type="button" class="hll wll" value="button" />

CSS3按钮 CSS3 Buttons

按钮示例 Sample Buttons

<input type="button" class="hs rounds ggrey bgrey_2 btn greybtn" value="button" />
<input type="button" class="hl rounds gb btn bluebtn" value="button" />
<input type="button" class="hl rounds gg btn greenbtn" value="button" />
<input type="button" class="hl rounds gr btn redbtn" value="button" />
<input type="button" class="hl rounds gc btn cyanbtn" value="button" />
<input type="button" class="hl  rounds gy btn yellowbtn" value="button" />

<input type="button" class="hl ws rounds ggrey bgrey_2 btn greybtn" value="button"/>
<input type="button" class="hl wm rounds gb btn bluebtn" value="button"/>
<input type="button" class="hl wl rounds gg btn greenBtn" value="button"/>
<input type="button" class="hl wll rounds gr btn redbtn" value="button"/>
<input type="button" class="hl w-15  rounds gc btn cyanbtn" value="button"/>
<input type="button" class="h-6 w-16  rounds gy btn yellowbtn" value="button"/>
下拉菜单按钮 Dropdown Buttons
<button class="posr ps rounds ggrey borderGrey_2 btn greybtn">
	button
	<span class="trianglegt mts mls ib"></span>
</button>
<ul class="nolp pts pbs mts lsn bottom w-25 last border rounds sogrey">
	<li>
	<a class="hoverb hovercw block ps tdn" href="#">Action</a>
	</li>
	...
	<li class="bt">
	<a class="hoverb hovercw block ps tdn" href="#">Separated link</a>
	</li>
</ul>
<button class="posr ps rounds ggrey borderGrey_2 btn greybtn">
	button
	<span class="trianglewt mts mls ib"></span>
</button>
<ul class="nolp pts pbs mts lsn bottom w-25 last border rounds sogrey">
	<li>
	<a class="hoverb hovercw block ps tdn" href="#">Action</a>
	</li>
	...
	<li class="bt">
	<a class="hoverb hovercw block ps tdn" href="#">Separated link</a>
	</li>
</ul>
<div class="posr clearfix">
        <button class="posr br ib l ps  roundls gb btn bluebtn">
        Action
        </button>
        <button class="posr nobl ib l ps roundrs gb btn bluebtn">
        	<span class="triangleTopWhite ib"></span>
        </button>
</div>
<ul class="nolp pts pbs mts lsn bottom w-25 last border rounds sogrey">
        <li>
        <a class="hoverb hovercw block ps tdn" href="#">Action</a>
        </li>
        ...
        <li class="bt">
        <a class="hoverb hovercw block ps tdn" href="#">Separated link</a>
        </li>
</ul>

移动端按钮 Buttons for Mobile

基本按钮 Basic Buttons

button


button


button


button


button


button

带图标的基本按钮 Basic Buttons with icon

button


button

内联按钮 Inline Buttons

button button button button button button

带图标的内联按钮 Inline Buttons with Icon

button button button button button button

垂直按钮组 Vertical buttons group
水平按钮组 Horizontal buttons group