博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
Bootstrap 按钮
阅读量:7096 次
发布时间:2019-06-28

本文共 1001 字,大约阅读时间需要 3 分钟。

本章将通过实例讲解如何使用 Bootstrap 按钮。任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观。但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示:

以下样式可用于<a>, <button>, 或 <input> 元素上:

下面的实例演示了上面所有的按钮 class:

结果如下所示:

按钮大小

下表列出了获得各种大小按钮的 class:

下面的实例演示了上面所有的按钮 class:

结果如下所示:

按钮状态

Bootstrap 提供了激活、禁用等按钮状态的 class,下面将进行详细讲解。

激活状态

按钮在激活时将呈现为被按压的外观(深色的背景、深色的边框、阴影)。

下表列出了让按钮元素和锚元素呈激活状态的 class:

下面的实例演示了这点:

结果如下所示:

禁用状态

当您禁用一个按钮时,它的颜色会变淡 50%,并失去渐变。

下表列出了让按钮元素和锚元素呈禁用状态的 class:

下面的实例演示了这点:

链接 禁用链接

原始链接 禁用的原始链接

结果如下所示:

按钮标签

您可以在 <a>、<button> 或 <input> 元素上使用按钮 class。但是建议您在 <button> 元素上使用按钮 class,避免跨浏览器的不一致性问题。

下面的实例演示了这点:

链接

转载地址:http://znhql.baihongyu.com/

你可能感兴趣的文章
基于haar特征的Adaboost人脸检测技术
查看>>
springboot验证码重构
查看>>
oracle之ROWNUM的查询应用
查看>>
Spring- 通过Xml的方式完成Bean的实例化
查看>>
20155303 实验三 敏捷开发与XP实践
查看>>
web性能优化学习
查看>>
如何选择容器,主要从存放要求和读写数据效率两方面考虑
查看>>
QT——信号槽
查看>>
JAVA FILE.renameTo跨文件系统移动文件失败
查看>>
三次样条插值 c++
查看>>
python练习程序(得到HTML文件的title)
查看>>
TerminateProcess的使用问题
查看>>
Excel里批量取消超链接,并设置字体号
查看>>
GOLANG 常用命令
查看>>
python字符串--下标与切片
查看>>
Dobbo问题及解决方案:forbid-consumer
查看>>
操作系统 实验三 进程调度模拟程序
查看>>
意见汇总
查看>>
php 投票
查看>>
用IO的方式生成dbf
查看>>