bootstrap系列之十二输入框

最新推荐文章于 2020-10-21 20:41:49 发布

叶菩提

最新推荐文章于 2020-10-21 20:41:49 发布

阅读量346

点赞数

分类专栏： JAVAEE 文章标签： bootstrap

本文链接：https://blog.csdn.net/yeputi1015/article/details/76762493

版权

JAVAEE 专栏收录该内容

23 篇文章 0 订阅

订阅专栏

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
								<meta name="viewport" content="width=device-width, initial-scale=1">
		<title>demo01</title>
		<link rel="stylesheet" href="css/bootstrap.min.css" />
		<script type="application/javascript" src="js/jquery-1.11.1.min.js"></script>
	    <script language="JavaScript" src="js/bootstrap.min.js"></script>
	</head>
	<body>
		<div class="container">
		 <h1>基本用法</h1>
			
			<div class="input-group">
				<span class="input-group-addon">@</span>
				<input type="text" class="form-control" />
				<span class="input-group-addon">.00</span>
			</div>
			
			<div class="input-group input-group-lg">
				<span class="input-group-addon glyphicon glyphicon-user"></span>
				<input type="text" class="form-control" />
				
			</div>
			<div class="input-group">
				<span class="input-group-addon glyphicon glyphicon-user"></span>
				<input type="text" class="form-control" />
				
			</div>
			<div class="input-group input-group-sm">
				<span class="input-group-addon glyphicon glyphicon-user"></span>
				<input type="text" class="form-control" />
				
			</div>
			<hr/>
				<div class="input-group">
				<span class="input-group-addon">
					<input type="checkbox" />
				</span>
				<input type="text" class="form-control" />
				
			</div>
			<hr />
			<div class="input-group">
				<span class="input-group-btn">
					<button type="button" class="btn btn-danger">OK</button>
					<button type="button" class="btn btn-danger">OK</button>
					<button type="button" class="btn btn-danger">OK</button>
				</span>
				<input type="text" class="form-control" />
			</div>
			<hr/>
			<div class="input-group">
				<div class="input-group-btn">
					 <button type="button" 
					 class="btn btn-default dropdown-toggle"
					 data-toggle="dropdown">
					 	Action
					    <span class="caret"></span>
					 </button>
				     <ul class="dropdown-menu">
				     	<li><a href="#">项目</a></li>
				     	<li><a href="#">项目</a></li>
				     	<li><a href="#">项目</a></li>
				     </ul>
				</div>
				<input type="text" class="form-control" />
				
			</div>
		</div>
	</body>
</html>