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. token 和 服务器端auth0-JWT包的使用
			
    移动客户端和服务器端在用户登录上经常使用的是一个叫做token的认证方法 token是什么? token顾名思义, 令牌, 意思就是说,第一次用户登录验证之后,服务器返回一个token令牌,之后客户端 ...
    
			
    2. 
						
  2. c# 调用 c dll 例子
			
    // case 1 传递 int* ///////////////////////////////////////////// extern “C” __declspec(dllexport) int ...
    
			
    3. 
						
  3. VS2013个版本密钥(亲测可用)
			
    Visual Studio Ultimate 2013 KEY(密钥):BWG7X-J98B3-W34RT-33B3R-JVYW9 Visual Studio Premium 2013 KEY(密钥) ...
    
			
    4. 
						
  4. asp.net的HTTP请求处理过程
			
    1.asp.net的HTTP请求处理过程 说明: (1).客户端浏览器向服务器发出一个http请求,此请求会被inetinfo.exe进程截获,然后转交给aspnet_isapi.dll进程,接着它又 ...
    
			
    5. 
						
  5. 关于Angular中时间戳的计算
			
    前言 使用的是Moment.js 插件,插件的安装详情请参考官方网址(https://momentjs.com/) 正文 步骤一:引用import * as moment from 'moment'; ...
    
			
    6. 
						
  6. [Swift] 创建一个对象
			
    创建一个对象 先写一个People类 // // People.swift // Class // // Created by YouXianMing on 15/3/18. // Copyright ...
    
			
    7. 
						
  7. Python学习---面向对象的学习[深入]
			
    类的深入学习    a. Python中一切事物都是对象     b. class Foo:             pass                obj = Foo()         # ...
    
			
    8. 
						
  8. July 29th 2017 Week 30th Saturday
			
    Where there is great love, there are always miracles. 哪里有真爱存在,哪里就有奇迹发生. Everyone expects there can b ...
    
			
    9. 
						
  9. Python 及其基础语法
			
    重新开始玩 Python,打算就是学完实验楼的"Python3 简明教程",然后就可以玩点小项目,先前学了点 Python2 就不管它啦. 以上. 认识 Python Python ...
    
			
    10. 
						
  10. Vim 编辑器及其基本操作
			
    实验楼某些课程有用 Vim 编辑器来写代码,因此有了这篇博客,据说是上古神器,当然主要目的是基本操作. Vim 编辑器 Vim(Vi IMprove) 是 Linux 系统上的最著名的文本/代码编辑器 ...
    
			
    11.