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. Android 将Activity殴打jar包 对于由第三方使用 解决XML 图片 文本资源并不难过进入jar包装问题!

    做项目需要打包成jar文件供第三方使用项目要求(将图片 文字资源写到到jar包中,第三方调用时,仅须要在AndroidManifest.xml配置下对应的Activity通过StartActivity ...

  2. 虚拟化技术学习(一)在VMware虚拟机中安装KVM

    近期一直研究虚拟化技术,曾经对VMware虚拟机有一定的了解,近期突发奇想,能不能在VMware虚拟机中再装一个虚拟机呢? 那么问题就来了,首先,你须要一台电脑,vmware软件,(本人的电脑配置渣渣 ...

  3. Visual Studio跨平台开发实战(2) - Xamarin.iOS基本控制项介绍

    原文 Visual Studio跨平台开发实战(2) - Xamarin.iOS基本控制项介绍 前言 在上一篇文章中, 我们介绍了Xamarin 以及简单的HelloWorld范例, 这次我们针对iO ...

  4. sed中求公共前缀

    string1="test toast" string2="test test" printf "%s\n%s\n" "$stri ...

  5. BZOJ 1269 文本编辑器 Splay

    题目大意:维护一个文本编辑器,支持下列操作: 1.将光标移动到某一位置 2.在光标后插入一段字符串 3.删除光标后的一段字符 4.翻转光标后的一段字符 5.输出光标后的一个字符 6.光标-- 7.光标 ...

  6. 给节点设置tag【从零開始cocos3.0final 】

    在cocos中通过tag来管理节点是非经常常使用的:以下介绍一个关于在cocos中使用tag的实例: typedef enum{ tag1 }Tag; 这里能够使用枚举类型,来为多个节点设置tag: ...

  7. 开源Math.NET基础数学类库使用(14)C#生成安全的随机数

    原文:[原创]开源Math.NET基础数学类库使用(14)C#生成安全的随机数                本博客所有文章分类的总目录:http://www.cnblogs.com/asxinyu/ ...

  8. EXCEL随机密码生成函数

    =CHAR(INT(RAND()*+))&INT(RAND()*+)&CHAR(INT(RAND()*+))&INT(RAND()*+)&CHAR(INT(RAND() ...

  9. android 网络运营商的名字显示规则(锁定屏幕,下拉列表)

    一:Background & 有关flow MTK Operator name display分为两种类型的手机: 1. Sim卡名称: 从基于引导SIM卡读取IMSI到Spn-conf.xm ...

  10. hdu 2049 别easy列(4)——测试新郎

    问题: 使用double定义的数量和long数定义19-20出现分歧,原因不明.求大公社. 这个问题需要用long,否则,只是通过,这应该纠结了很久. 问题是乘以一个交错的思想相结合. 不easy系列 ...