代码拉取完成，页面将自动刷新
<!--
This work by http://twitter.com/Ben_Lowe of http://www.triballabs.net is licensed under a Creative Commons Attribution-NonCommercial-ShareAlike 2.0 UK: England & Wales License.
http://creativecommons.org/licenses/by-nc-sa/2.0/uk/
-->
<!DOCTYPE html>
<html lang="en">
<head>
<meta content="width=device-width, initial-scale=1.0" name="viewport" />
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="css/bootstrap.css" rel="stylesheet" />
<link href="css/bootstrap-responsive.css" rel="stylesheet" />
<link href="css/docs.css" rel="stylesheet" />
<link href="css/tribal-bootstrap.css" rel="stylesheet" />
<link href="css/tribal-form.css" rel="stylesheet" />
<script type="text/javascript" src="js/jquery-latest.js"></script>
<script type="text/javascript" src="js/jquery.ba-resize.js"></script>
<script type="text/javascript" src="js/bootstrap-collapse.js"></script>
<script type="text/javascript" src="js/tribal-shared.js"></script>
<script type="text/javascript" src="js/tribal-form.js"></script>
<title>Multi-Column Definition Lists</title>
<script type="text/javascript">
var _gaq = _gaq || [];
_gaq.push(['_setAccount', 'UA-21875603-1']);
_gaq.push(['_addDevId', 'i9k95']); // Google Analyticator App ID with Google
_gaq.push(['_trackPageview']);
_gaq.push(['_trackPageLoadTime']);
(function () {
var ga = document.createElement('script'); ga.type = 'text/javascript'; ga.async = true;
ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(ga, s);
})();
</script>
</head>
<body data-offset="50">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span><span class="icon-bar"></span><span class="icon-bar">
</span>
</button>
<a class="brand" href="#">TribalLabs</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li><a href="Timetable.htm">Timetable</a></li>
<li class="active"><a href="TwoColumnList.htm">Multi-Column Definition List</a></li>
</ul>
</div>
</div>
</div>
</div>
<div class="container">
<header class="jumbotron subhead" id="overview">
<h1>Multi-Column Definition Lists</h1>
</header>
<p>
View the <a target="_blank" href="http://www.triballabs.net/2012/08/multi-column-bootstrap-definition-lists-using-jquery-html-css/">
blog post</a> supporting this sample code.</p>
<div class="well">
<dl class="dl-horizontal dl-multicolumn" data-colcount="3">
<dt>Name</dt>
<dd>
Ben Lowe</dd>
<dt>Gender</dt>
<dd>
Male</dd>
<dt>School</dt>
<dd>
Sheffield School</dd>
<dt>DOB</dt>
<dd>
01/01/1986</dd>
<dt>Email</dt>
<dd>
<a href="mailto:name@company.co.uk">name@company.co.uk</a></dd>
<dt>Phone</dt>
<dd>
<a class="visible-phone" href="tel:+441142196000">+44 114 2196000</a><a class="hidden-phone"
href="callto:+441142196000">+44 114 2196000</a></dd>
<dt>Address</dt>
<dd>
26 Main Road<br />
Sheffield<br />
S1 1AA</dd>
</dl>
</div>
<div class="row">
<div class="span8">
<div class="well">
<dl class="dl-horizontal dl-multicolumn" data-colcount="2">
<dt>Name</dt>
<dd>
Here is a much longer bit of text. Let's see if it wraps. Here is a much longer
bit of text. Let's see if it wraps. Here is a much longer bit of text. Let's see
if it wraps. Here is a much longer bit of text. Let's see if it wraps. Here is a
much longer bit of text. Let's see if it wraps. Here is a much longer bit of text.
Let's see if it wraps.</dd>
<dt>Name</dt>
<dd>
Here is a much longer bit of text. Let's see if it wraps. Here is a much longer
bit of text. Let's see if it wraps. Here is a much longer bit of text. Let's see
if it wraps. Here is a much longer bit of text. Let's see if it wraps. Here is a
much longer bit of text. Let's see if it wraps. Here is a much longer bit of text.
Let's see if it wraps.</dd>
<dt>Address with<br />
a long name</dt>
<dd>
26 Main Road<br />
Sheffield<br />
S1 1AA</dd>
</dl>
</div>
</div>
<div class="span4">
<div class="well">
<dl class="dl-horizontal">
<dt>Long text</dt>
<dd>
Here is a much longer bit of text. Let's see if it wraps. Here is a much longer
bit of text. Let's see if it wraps. Here is a much longer bit of text. Let's see
if it wraps. Here is a much longer bit of text. Let's see if it wraps. Here is a
much longer bit of text. Let's see if it wraps. Here is a much longer bit of text.
Let's see if it wraps.</dd>
<dt>Short</dt>
<dd>
Here is a short bit of text.</dd>
</dl>
</div>
</div>
</div>
<div class="well">
<a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/2.0/uk/deed.en_GB">
<img alt="Creative Commons Licence" style="border-width: 0" src="http://i.creativecommons.org/l/by-nc-sa/2.0/uk/88x31.png" /></a><br />
This work by <a target="_blank" href="http://twitter.com/Ben_Lowe">Ben Lowe</a>
of <a target="_blank" href="http://www.triballabs.net">Tribal Labs</a> is licensed
under a <a rel="license" href="http://creativecommons.org/licenses/by-nc-sa/2.0/uk/deed.en_GB">
Creative Commons Attribution-NonCommercial-ShareAlike 2.0 UK: England & Wales
License</a>.
</div>
</div>
</body>
</html>
此处可能存在不合适展示的内容，页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容，可点击提交进行申诉，我们将尽快为您处理。
马建仓 AI 助手