bootstrap 学习笔记 - 6 （输入框组 + ）

来源：互联网发布：it数据分析师编辑：程序博客网时间：2024/05/19 07:25
Bootstrap学习

bootsrap学习之 - 输入框组

样例代码：

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%><%String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";%><!DOCTYPE html><html lang="zh_CN"><head><base href="<%=basePath%>"><link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap3/css/bootstrap.min.css"><link rel="stylesheet" href="${pageContext.request.contextPath}/bootstrap3/css/bootstrap-theme.min.css"><script src="${pageContext.request.contextPath}/bootstrap3/js/jquery-1.7.2.min.js"></script><script src="${pageContext.request.contextPath}/bootstrap3/js/bootstrap.min.js"></script><script src="${pageContext.request.contextPath}/bootstrap3/js/bootstrap-dropdown.js"></script></head><body style="padding: 20px;"><div class="input-group input-group-lg"><span class="input-group-addon">@</span><input class="form-control" placeholder="Email" /></div><div class="input-group"><span class="input-group-addon">@</span><input class="form-control" placeholder="Email" /></div><div class="input-group input-group-sm"><span class="input-group-addon">@</span><input class="form-control" placeholder="Email" /></div><br /><!--作为额外元素的多选框和单选框--><div class="row"><div class="col-lg-6"><div class="input-group"><span class="input-group-addon"> <input type="checkbox" aria-label="..."> </span><input type="text" class="form-control" aria-label="..."></div></div><div class="col-lg-6"><div class="input-group"><span class="input-group-addon"> <input type="radio" aria-label="..."> </span><input  type="text" class="form-control" aria-label="..."></div></div></div><br/><div class="row"><div class="col-lg-6"><div class="input-group"><span class="input-group-addon"> <input type="checkbox" aria-label="..."> </span><input type="text" class="form-control" aria-label="..."></div></div><div class="col-lg-6"><div class="input-group"><span class="input-group-addon"> <input type="radio" aria-label="..."> </span><input type="text" class="form-control" aria-label="..."></div></div></div></body></html>
效果图：

0 0