首页 > 代码库 > bootstrap-按钮样式

bootstrap-按钮样式

<div class="container">
	<!-- 按钮的背景色 -->
	<div class="row">
		<button class="btn btn-default">确定</button>
		<button class="btn btn-primary">确定</button>
		<button class="btn btn-success">确定</button>
		<button class="btn btn-info">确定</button>
		<button class="btn btn-warning">确定</button>
		<button class="btn btn-danger">确定</button>
		<button class="btn btn-link">确定</button>
	</div>

	<!-- btn-block 让按钮的宽度变为100%,成为块级元素-->
	<div class="row" style="margin-top: 20px">
		<button class="btn btn-primary btn-block">确定</button>
	</div>

	<!-- 激活状态-->
	<div class="row" style="margin-top: 20px">
		<button class="btn btn-primary active">确定</button>
		<a href="http://www.mamicode.com/#" class="btn btn-warning active">确定</a>
	</div>

	<!-- 禁用-->
	<div class="row" style="margin-top: 20px">
		<button class="btn btn-primary active" disabled>确定</button>
		<button class="btn btn-info active disabled">确定</button>
		<a href="http://www.mamicode.com/#" class="btn btn-warning">确定</a>
	</div>
</div>

可以btn-lg, btn-md, btn-sm,btn-xs来设置按钮大小的;

效果图:

技术分享

bootstrap-按钮样式