首页 > 网站 > WEB开发 > 正文

10.按钮

2024-04-27 15:05:26
字体:
来源:转载
供稿:网友

代码如下:

<div class="container"> <div class="row"><!--按钮的背景颜色--> <button type="button" class="btn btn-default">chaixingsi</button> <button type="button" class="btn btn-PRimary">chaixingsi</button> <button type="button" class="btn btn-success">chaixingsi</button> <button type="button" class="btn btn-info">chaixingsi</button> <button type="button" class="btn btn-warning">chaixingsi</button> <button type="button" class="btn btn-danger">chaixingsi</button> <button type="button" class="btn btn-link">chaixingsi</button> </div> <div class="row" style="margin-top: 20px"><!--按钮的尺寸--> <button type="button" class="btn btn-default btn-lg">chaixingsi</button> <button type="button" class="btn btn-primary btn-md">chaixingsi</button> <button type="button" class="btn btn-success btn-sm">chaixingsi</button> <button type="button" class="btn btn-info btn-xs">chaixingsi</button> </div> <div class="row" style="margin-top: 20px"><!--让按钮的宽度变为100%,并且变为块级元素--> <button type="button" class="btn btn-success btn-block">chaixingsi</button> </div> <div class="row" style="margin-top: 20px"> <a href="#" class="btn btn-success active">chaixingsi</a><!--a标签也可以成为按钮,加上active变为激活状态--> <button type="button" class="btn btn-info disabled">chaixingsi</button><!--禁用按钮--> <button type="button" class="btn btn-info" disabled>chaixingsi</button><!--和上一句比较禁用的不同--> </div> </div>

运行结果: 这里写图片描述


发表评论 共有条评论
用户名: 密码:
验证码: 匿名发表