1.正常的使用

    <div class="form-group">
<div class="input-group">
<input class="form-control" type="text" placeholder="1000">
<div class="input-group-addon">人民币</div>
     </div>
</div>

效果

2.特殊使用(两个控件合并成一个)

<div class="form-group">
<div class="input-group">
  <div class="input-group-btn">
          <select class="form-control" style="width: 110px;">
            <option>http://</option>
            <option>https://</option>
          </select>
        </div>
  <input class="form-control" type="email" placeholder="www.baidu.com">
</div>
</div>

 效果

  

boostrap-非常好用但是容易让人忽略的地方------input-group-btn的更多相关文章

  1. boostrap-非常好用但是容易让人忽略的地方------Font Awesome

    font-awesome基本用法 官方代码传送门 font-awesome在bootstrap中的特殊用法(这个才是重点) 要点归纳1(官方) 官方代码传送门 要点归纳2(我的) <a href ...

  2. boostrap-非常好用但是容易让人忽略的地方------clearfix

    代码 显示结果 代码 结果

  3. boostrap-非常好用但是容易让人忽略的地方------row

    row是非常好用但是却非常容易忽略的地方. 想实现内部元素相对父级的padding=0,则在父子中间加个row.如下图 列嵌套也是同样的道理 经验之谈:学会row的用法,在手机版布局的时候会很方便,否 ...

  4. boostrap-非常好用但是容易让人忽略的地方------modal

    使用bootstrap框架好久了,在开发中也用到了或者遇到了很多的问题,所以跟大家分享一下 bootstrap modal 组件的样式 .modal-lg .modal-sm 说明:这个是bootst ...

  5. boostrap-非常好用但是容易让人忽略的地方【7】:list-unstyled list-inline

    无样式列表 list-unstyled:去掉ul的默认样式 内联列表 list-inline:将ul子元素放置于同一行

  6. boostrap-非常好用但是容易让人忽略的地方【6】:role属性

    普通样式,鼠标hover没有任何效果 <span>content</span> 加上role属性的样式,鼠标hover会有cursor:pointer的效果 <span ...

  7. boostrap-非常好用但是容易让人忽略的地方【5】:input-group-btn

    1.正常的使用 <div class="form-group"> <div class="input-group"> <input ...

  8. boostrap-非常好用但是容易让人忽略的地方【4】:Font Awesome

    font-awesome基本用法 官方代码传送门 font-awesome在bootstrap中的特殊用法(这个才是重点) 要点归纳1(官方) 官方代码传送门 要点归纳2(我的) <a href ...

  9. boostrap-非常好用但是容易让人忽略的地方【3】:clearfix

    代码 显示结果 代码 结果

随机推荐

  1. Thinkphp中的volist标签(查询数据集(select方法)的结果输出)用法简介

    参考网址:http://camnpr.com/archives/1515.html 通常volist标签多用于查询数据集(select方法)的结果输出,通常模型的select方法返回的结果是一个二维数 ...

  2. The Swift Programming Language 中国版

    iSwifting社会的 Swift 兴趣交流群:303868520 iOS 微信公众账号:iOSDevTip Swift 微信公众账号:SwiftDev iSwifting社区 假设你认为这个项目不 ...

  3. 《JavaScript设计模式与开发实践》读书笔记之命令模式

    1.命令模式 1.1 传统的命令模式 命令模式的应用场景:请求的发送者和请求接收者消除彼此耦合关系 以页面点击按钮为例 点击按钮后,借助命令对象,解开按钮和负责具体行为对象之间的耦合 <body ...

  4. 《JavaScript设计模式与开发实践》读书笔记之策略模式

    1.策略模式 定义一系列算法,把它们一个个封装起来,并且使它们可以相互替换 1.1 传统实现 根据工资基数和年底绩效来发送年终奖 var calculateBonus= function (perfo ...

  5. SecureCRT学习之道:用SecureCRT来上传和下载数据

    今天才知道,原来SecureCRT可以使用linux下的zmodem协议来快速的传送文件,而且还使用非常方便哦,我还傻傻的找其他软件来sftp,笨死了:(你只要设置一下上传和下载的默认目录就行opti ...

  6. VBA怎样统计同一类型的数据的总和

    今天是2014-11-01 是周末,忙了一周了,最终能够闲下来了.想起近期工作用到的VBA的一个场景,结合VBA的数组,所以就想试试看.结果还好.出来了.这年头,又玩起了VB了,经过多时才接受了VB的 ...

  7. OCA读书笔记(18) - 使用Support工具

    调查和解决问题 问题:数据库中的任一严重的错误定义为一个问题,一般来说,这些错误包括大家熟悉的ORA-600错误和ORA-04031(共享池超出)错误,涉及数据库问题的所有元数据都存储在ADR中,每个 ...

  8. 使用cocos2d 2.1制作一条河游戏(4): 主要的游戏逻辑BaseLayer设计

    前段时间一直忙着.没有时间更新博客.今天,仍然需要一段时间才能实现对游戏的一小部分,最后打动他. BaseLayer.h: #import <GameKit/GameKit.h> #imp ...

  9. 最小路径覆盖 hdu 1151 hdu 3335

    Air Raid Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 65536/32768 K (Java/Others) Total S ...

  10. 懒人模式Singleton模式Meyers版本号

    直接看代码: /* Singleton模式保证:在一个程序,,一个类有且只有一个实例.并提供一个访问 它的全局访问点 在编程其中.很多情况下,需要确保有一类的一个实例 比如: windopws系统中仅 ...