Bootstrap04概述

一.输入框组

1.左侧添加文字

            <div class="input-group">
<span class="input-group-addon">$</span>
<input class="form-control" type="text" name="" id="" value="" />
</div>

2.右侧添加文字

            <div class="input-group">
<input class="form-control" type="text" name="" id="" value="" />
<span class="input-group-addon">@qq.com</span>
</div>

3.两侧添加文字

            <div class="input-group">
<span class="input-group-addon">$</span>
<input class="form-control" type="text" name="" id="" value="" />
<span class="input-group-addon">.</span>
</div>

3.左侧使用复选框+单选框(注意:实现单选框效果,需要添加name属性)

            <div class="input-group">
<span class="input-group-addon">
<input type="checkbox" name="" id="" value="" />
</span>
<input class="form-control" type="text" name="" id="" value="" />
</div>
<div class="input-group">
<span class="input-group-addon">
<input type="radio" name="sex" id="" value="" />
</span>
<input class="form-control" type="text" name="" id="" value="" />
</div>
<div class="input-group">
<span class="input-group-addon">
<input type="radio" name="sex" id="" value="" />
</span>
<input class="form-control" type="text" name="" id="" value="" />
</div>

4.右侧使用按钮

            <div class="input-group">
<input class="form-control" type="text" name="" id="" val..ue="" />
<div class="input-group-btn">
<button class="btn btn-primary">提交</button>
</div>
</div>

5.左侧使用下拉菜单

            <div class="input-group">
<div class="input-group-btn">
<button class="btn btn-warning" data-toggle="dropdown">搜索

Bootstrap04的更多相关文章

随机推荐

  1. restful知识点之三restframework认证-->权限-->频率

    认证.权限.频率是层层递进的关系 权限业务时认证+权限 频率业务时:认证+权限+频率 局部认证方式 from django.conf.urls import url,include from djan ...

  2. 安装 Python IDLE (Linux)

    Python IDLE (Integrated Development and Learning Environment) 是一个官方的轻量级 Python IDE.在不同的 Linux 的发布版本中 ...

  3. 用适配器模式处理复杂的UITableView中cell的业务逻辑

    用适配器模式处理复杂的UITableView中cell的业务逻辑 适配器是用来隔离数据源对cell布局影响而使用的,cell只接受适配器的数据,而不会与外部数据源进行交互. 源码: ModelCell ...

  4. Python学习---django模板继承180123

    django模板继承  --20180123 a.include 模板标签 b.extend(继承)模板标签 ------include 模板标签 该标签允许在(模板中)包含其它的模板的内容. 标签的 ...

  5. Asp.Net MVC Identity 2.2.1 使用技巧(七)

    创建角色管理相关视图 1.添加视图 打开RolesAdminController.cs   将鼠标移动到public ActionResult Index()上  右键>添加视图   系统会弹出 ...

  6. 读 CSI讲义 费马小定理

    费马小定理 最近在上计算机安全学选修课.. 读老师博客..现在当是写阅读笔记吧. 这里贴出老师的简书建议先看看链接先..毕竟我这些东西只是搞笑一下的.. 遵循一下这个原则… 观察 找规律 求证 首先是 ...

  7. CocoaPods -- ios项目中安装和使用CocoaPods

    CocoaPods是什么? 当你开发iOS应用时,会经常使用到很多第三方开源类库,比如JSONKit,AFNetWorking等等.可能某个类库又用到其他类库,所以要使用它,必须得另外下载其他类库,而 ...

  8. Python、R对比分析

    一.Python与R功能对比分析 1.python与R相比速度要快.python可以直接处理上G的数据:R不行,R分析数据时需要先通过数据库把大数据转化为小数据(通过groupby)才能交给R做分析, ...

  9. 外网访问用azure虚拟机搭建的网站

    1.Ubuntu+Apache+PHP的环境搭建(此处省去了mysql的步骤) 在azure上搭建上述的开发环境和在本地PC搭建是一样的步骤,具体介绍请参看这里. 2.从外网访问 注意,这一步的前提是 ...

  10. SVN There are unfinished transactions detected

    在ECLIPSE中报这个错,不能提交和更新代码和clean up 解决办法:关闭ECLIPSE,使用工具对SVN执行 clean up. 重新启动ECLIPSE,解决冲突文件,可以正常使用SVN