位置: 编程技术 - 正文

详解Bootstrap按钮(bootstrap按钮的风格有哪些?)

编辑:rootadmin

推荐整理分享详解Bootstrap按钮(bootstrap按钮的风格有哪些?),希望有所帮助,仅作参考,欢迎阅读内容。

文章相关热门搜索词:bootstrap options,bootstrap options,bootstrap 按钮,bootstrap 按钮,bootstrap怎么让按钮居中,bootstrap 按钮,bootstrap 按钮,bootstrap按钮图标,内容如对您有帮助,希望把文章链接给更多的朋友!

描述

Bootstrap Button(按钮)JavaScript 插件允许您加强按钮的功能。您可以控制按钮的状态,也可以为组件创建按钮组,比如工具条。

什么是必需的

您必须引用 jquery.js 和 bootstrap-button.js - 这两个 JavaScript 文件。它们都位于 docs/assets/js 文件夹内。

如何使用它

您可以不编写任何 JavaScript 只通过标记使用该插件,也可以通过 JavaScript 启用按钮。

Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示:

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

类 描述 .btn 为按钮添加基本样式 .btn-default 默认/标准按钮 .btn-primary 原始按钮样式(未被操作) .btn-success 表示成功的动作 .btn-info 该样式可用于要弹出信息的按钮 .btn-warning 表示需要谨慎操作的按钮 .btn-danger 表示一个危险动作的按钮操作 .btn-link 让按钮看起来像个链接 (仍然保留按钮行为) .btn-lg 制作一个大按钮 .btn-sm 制作一个小按钮 .btn-xs 制作一个超小按钮 .btn-block 块级按钮(拉伸至父元素%的宽度) .active 按钮被点击 .disabled 禁用按钮

首先看下不同颜色的按钮:

效果:

详解Bootstrap按钮(bootstrap按钮的风格有哪些?)

btn-default / btn-primary /btn-success/ btn-info/ btn-warning/ btn-danger/ btn-link给按钮加上了不同的样式。

按钮大小

鉴于head部分都是相同的,只列出Body的内容。

效果如下所示:

按钮状态

按钮分为active和disabled两种状态、激活状态:按钮呈现出被按压的外观,即背景颜色变深、深色边框和阴影。禁用状态:按钮颜色会变淡 %,并失去渐变

看具体的例子:

按钮标签

a,input都可以表现的像一个按钮,但是避免跨浏览器不一致,最好使用Button标签。

以上内容给大家介绍了Bootstrap按钮相关知识,希望大家喜欢。

详解Bootstrap glyphicons字体图标 本章将讲解字体图标(Glyphicons),并通过一些实例了解它的使用。Bootstrap捆绑了多种字体格式的字形。首先让我们先来理解一下什么是字体图标。首先

详解Bootstrap的aria-label和aria-labelledby应用 aria-label正常情况下,form表单的input组件都有对应的label.当input组件获取到焦点时,屏幕阅读器会读出相应的label里的文本。如:!DOCTYPEhtmlhtmlheadmetacharset="

Javascript基于对象三大特性(封装性、继承性、多态性) Javascript基于对象的三大特征和C++,Java面向对象的三大特征一样,都是封装(encapsulation)、继承(inheritance)和多态(polymorphism)。只不过实现的方式不同,其基

标签: bootstrap按钮的风格有哪些?

本文链接地址:https://www.jiuchutong.com/biancheng/384695.html 转载请保留说明!

上一篇:详解Bootstrap四种图片样式

下一篇:详解Bootstrap glyphicons字体图标(详解九章算法)

  • 一般纳税人开劳务发票几个点
  • 子公司自购买日开始持续计算的净资产包括商誉吗
  • 无形资产属于货币性项目吗
  • 小规模进项可以收专票吗
  • 工资绩效被扣除怎么办
  • 一次性发放年终奖怎么税务筹划
  • 高新企业要求研发投入
  • 非流动资产处置损失属于什么会计科目
  • 未开业零升报企业是否做年度汇算清缴申报
  • 农产品代销合同协议书范本
  • 年底结账会计处理
  • 加工开票税率是多少
  • 其他应付款余额在借方表示什么意思
  • 个人转让住房要交哪些税费?
  • 设立独立核算的销售机构的筹划
  • 固定资产金额小于5000元,可以不一次性税前扣除吗
  • 增值税的销项税额和进项税额的区别
  • 咨询公司怎么交社保
  • 房屋产权无偿赠与合同范本
  • 劳务派遣公司的作用
  • 少计提的地税怎么做分录
  • 普通年金的概念和内涵
  • 请问王者荣耀是谁发明的
  • php怎么实现代码运行功能
  • win10显示无法连接蓝牙
  • php 错误和异常处理
  • 苹果macOSBigSur是什么型号
  • 数据库olap
  • 发票章盖的不清楚可以在旁边再盖一个吗
  • 购买用友财务软件
  • 企业销售商品怎么做分录
  • vite怎么打包
  • 勃朗峰高度
  • 政策性搬迁补偿收入
  • vue 可拖拽
  • 2023前端面试题目
  • PHP模拟http请求的方法详解
  • js数组方法filter
  • 多线程并发python
  • 公司在银行买的理财产品怎么做账
  • 增值税普通发票可以抵扣吗
  • 公司扣除保险费会计分录
  • 多计提的个税能退回给员工吗
  • 以前年度少计成本的税务处理
  • 农民专业合作社税收优惠政策
  • 免税商品外汇业务
  • 为外单位人员报备流程
  • 银行开户的费用计入什么科目
  • 委托代理进出口
  • 快递费算不算运输费
  • 企业取得的财政拨款
  • 金融存款利率
  • 外派员工的薪酬构成有哪些项目
  • 新建厂房哪些费用可以计入
  • 一般要做代理,授权书有什么用
  • 核定征收的小微企业
  • 无形资产什么时候开始计提折旧
  • 关于sql的几道小知识
  • mysqlusing
  • mysql怎么实现
  • dell bios密码忘记
  • unix操作系统命令
  • windows电脑设置
  • centos7 中文支持
  • win 8.1 preview ISO镜像安装方法简易教程
  • mac mail邮件本地存储路径
  • linux中vi命令详解
  • win10 rs3
  • 游戏引擎的重要性
  • ecmascript6入门
  • 万向节锁到底是什么
  • 微信小程序实现轮播图
  • nodejs连接redis
  • unity study
  • Android studio第一行报错
  • shell脚本获取文件指定内容
  • js验证身份证合法性
  • 个体户需要报个税的综合所得吗
  • 车辆购置税怎样做账
  • 合格的税务人
  • 免责声明:网站部分图片文字素材来源于网络,如有侵权,请及时告知,我们会第一时间删除,谢谢! 邮箱:opceo@qq.com

    鄂ICP备2023003026号

    网站地图: 企业信息 工商信息 财税知识 网络常识 编程技术

    友情链接: 武汉网站建设