Bootstrap中按钮的几种实现方法

2025-07-10 21:55:14

1、打开WebStorm开发工具,新建‘test.html’,并在同级目录创建部署bootstrap相关文件,目录结构如下图

Bootstrap中按钮的几种实现方法

3、网页查看效果如下图,调整button的大小,还可以加上.btn-lg、.btn-sm 或 .btn-xs的属性

Bootstrap中按钮的几种实现方法

5、网页查看效果如下图

Bootstrap中按钮的几种实现方法

7、网页查看效果,发现使用input的通栏按钮组并不能实现,其实用button这样写法也不能实现,只有a标签可以,在使用input和button做通栏按钮组时候外层需要再包装一个div btn-group[

Bootstrap中按钮的几种实现方法

9、网页查看效果如下图,一切正常了,注意通栏按钮组使用方法。

Bootstrap中按钮的几种实现方法
声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢