Bootstrap Well
Wells将内容封装在灰色背景的圆角框中。
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet"
href="https://maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css">
</head>
<body style="margin:30px">
<div class="well">
<p>Lorem ipsum dolor sit amet, consectetur ... </p>
</div>
</body>
</html>注意
Bootstrap Well有三种类型：
- 默认：只使用well类。
- 大间距：使用well和well-lg类。
- 小间距：使用well和well-sm类。
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap-theme.min.css">
<style type="text/css">
.bs-example{
margin: 20px;
}
</style>
</head>
<body>
<div class="bs-example">
<div class="well">Look, I"m in a well!</div>
<div class="well well-lg">Look, I"m in a large well!</div>
<div class="well well-sm">Look, I"m in a small well!</div>
</div>
</body>
</html>