zoukankan      html  css  js  c++  java
  • Bootstrap系列 -- 22. 按钮

      Bootstrap框架首先通过基础类名“.btn”定义了一个基础的按钮风格,然后通过“.btn-default”定义了一个默认的按钮风格。默认按钮的风格就是在基础按钮的风格的基础上修改了按钮的背景颜色边框颜色文本颜色。

    <button type="button" class="btn btn-default">基本样式</button>

      几种不同样式风格的按钮

      <button class="btn" type="button">基础按钮.btn</button>  
       <button class="btn btn-default" type="button">默认按钮.btn-default</button> 
       <button class="btn btn-primary" type="button">主要按钮.btn-primary</button> 
       <button class="btn btn-success" type="button">成功按钮.btn-success</button> 
       <button class="btn btn-info" type="button">信息按钮.btn-info</button> 
       <button class="btn btn-warning" type="button">警告按钮.btn-warning</button> 
       <button class="btn btn-danger" type="button">危险按钮.btn-danger</button> 
       <button class="btn btn-link" type="button">链接按钮.btn-link</button> 

      一般制作按钮除了使用<button>标签元素之外,还可以使用<input type="submit">和<a>标签等。同样,在Bootstrap框架中制作按钮时,除了刚才所说的这些标签元素之外,还可以使用在其他的标签元素上,唯一需要注意的是,要在制作按钮的标签元素上添加类名“btn”。如果不添加是不会有任何按钮效果

    <button class="btn btn-default" type="button">button标签按钮</button> 
    <input type="submit" class="btn btn-default" value="input标签按钮"/>
    <span class="btn btn-default">span标签按钮</span>  
    <div class="btn btn-default">div标签按钮</div>  
    <a href="" class="btn btn-default">标签</a>

      在Bootstrap框架中不同的按钮风格都是通过不同的类名来实现,下面是不同风格样式的说明

  • 相关阅读:
    对 Excel 工作簿中的数字签名和代码签名的说明
    单例模式
    面向对象
    Des对称加密
    Java获取电脑硬件信息
    鼠标双击事件不可描述的问题
    RSA不对称加密
    JTable表格案例
    控件刷新的奥秘
    反编译插件安装
  • 原文地址:https://www.cnblogs.com/qingyuan/p/4600889.html
Copyright © 2011-2022 走看看