Html 在引导中对齐图像和文本
以下是工作链接: 我如何创建一个像下面这样的东西,图像在左栏,文本在右栏 在引导中,每个class=行由12列组成。 意味着你必须使用它们 例如:Html 在引导中对齐图像和文本,html,css,twitter-bootstrap,Html,Css,Twitter Bootstrap,以下是工作链接: 我如何创建一个像下面这样的东西,图像在左栏,文本在右栏 在引导中,每个class=行由12列组成。 意味着你必须使用它们 例如: <!DOCTYPE html> <html> <head> <script src="http://code.jquery.com/jquery.min.js"></script> <link href="http://twitter.github.io/bootstrap/asse
<!DOCTYPE html>
<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="http://twitter.github.io/bootstrap/assets/css/bootstrap-responsive.css" rel="stylesheet" type="text/css" />
<script src="http://twitter.github.io/bootstrap/assets/js/bootstrap.js"></script>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body>
<div class="row">
<div class="col-sm-2"></div>
<div class="col-sm-8 main-container">
<h1>Welcome</h1>
<hr>
<div class="row">
<div class="col-sm-6">
<div class="row">
<div class="col-sm-2">
<img class="pull-left" src="http://placehold.it/32x32"/>
</div>
<div class="col-sm-4">
<h3>Capture Everything.</h3>
<p>Save all your data, data are significant and crucial.</p>
</div>
</div>
<div class="row">
<div class="col-sm-2">2</div>
<div class="col-sm-4">2</div>
</div>
<div class="row">
<div class="col-sm-2">3</div>
<div class="col-sm-4">3</div>
</div>
</div>
<div class="col-sm-6">Column 2</div>
</div>
</div>
<div class="col-sm-2"></div>
</div>
</body>
</html>
注意。您可以使用class=col-md-offset-5在上一个元素之间添加间距。我不理解class=col-md-offset-5部分。你能再解释一下吗?如果没有偏移量,你的元素将按定义的边距相邻设置。如果添加一些偏移量,则可以将元素彼此分开移动得更远。
<div class="row">
<p class="col-md-8">text text text</p>
<img src="/image.jpg" class="col-md-4" />
</div>