Bootstrap 示例 - 默认的 Well</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js></script>
</head>
<body>
<div class="well">您好，我在 Well 中！</div>
</body>
</html></pre><a target="_blank" href="/run/bootstrap-wells-1.html" class="btn btn-success btn-run">Testen Sie es heraus ‹/›</a></div><p>Die Ergebnisse sind wie folgt gezeigt:</p><div style="border: 1px solid #D6D6D6;padding: 5px;"></div><h2>尺寸大小</h2><p>您可以使用可选类 <strong>well-lg</strong> 或 <strong>well-sm</strong> 来改变 Well 的尺寸大小。这两个类是与 <strong>.well</strong> 类结合使用的。这两个类会影响内边距(padding)，根据使用的类，Well 会显示得更大或者更小。</p><h2>在线示例</h2><div class="example_code"><label class="example_title">示例</label><pre><!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Bootstrap 示例 - Well 的尺寸大小</title>
<link rel="stylesheet" href="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/css/bootstrap.min.css">
<script src="https://cdn.staticfile.org/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdn.staticfile.org/twitter-bootstrap/3.3.7/js/bootstrap.min.js></script>
</head>
<body>
<div class="well well-lg">Hallo, ich bin im großen Well!</div>
<div class="well well-sm">Hallo, ich bin im kleinen Well!</div>
</body>
</html></pre><a target="_blank" href="/run/bootstrap-wells-2.html" class="btn btn-success btn-run">Testen Sie es heraus ‹/›</a></div><p>Die Ergebnisse sind wie folgt gezeigt:</p><div style="border: 1px solid #D6D6D6;padding: 5px;"></div><div class="col-md-12 mb10 bg-ef"><a class="fr pre-xs-show-right" href="/bootstrap/bootstrap-make-a-website.html">BootstrapEineWebseiteErstellen</a><a class="fl pre-xs-show-left" href="/bootstrap/bootstrap-panels.html">BootstrapPANEL</a></div>
</div>
<div class="col-md-2 col-md-right">
<div class="panel panel-default">
</div>
<div class="panel panel-default">
</div>
</div>
</div>
</div>
<script src="/static/script/bootstrap.min.js" type="text/javascript"></script>
<link rel="stylesheet" href="/static/script/hljs/styles/vs.css">
<script src="/static/script/hljs/highlight.pack.js"></script>
<script>
hljs.initHighlightingOnLoad();
$(document).ready(function(){
$(".menu-icon").click(function(){
$(".col-md-left").toggle();
event=arguments.callee.caller.arguments[0] || window.event;
event.stopPropagation();
});
if($(".col-md-left").css("display")=="none"){
$("html,body").click(function(){
$(".col-md-left").hide();
});
}
});</script>
<div class="copyright" id="footer"><div class="container"><div class="row"><div class="col-sm-12"><span>Copyright ©2025 <a href="https://de.oldtoolbag.com">Grund教程</a> oldtoolbag.com</span></div></div></div></div><a class="gotop" href="#top" title="Zurück zum Anfang" style="display: none;"><span class="arrow"></span><span class="arrow lit"></span></a>
<a class="gotop" href="#top" title="Zurück zum Anfang" style="display: none;"><span class="arrow"></span><span class="arrow lit"></span></a>
<script src="/myjs/tongji.js"></script>
</body></html><script src="/cdn-cgi/scripts/7d0fa10a/cloudflare-static/rocket-loader.min.js" data-cf-settings="4aa2f3b9ccca1ec0576ca854-|49" defer></script>