当我展开屏幕时,问题是img-thumbnail没有居中。我想为什么这样做是因为我相信我不明白img-thumbnail的作用以及如何解决它。我会攻击我的html和css代码。我想我能够插入
classes="img-thumnail img-responsive center-block"
部分解决了我的问题,因为我希望标题包含在缩略图中。
HTML CODE
<div class="container-fluid">
<div class="well outline">
<h1 class="text-center">Ernest Miller Hemingway</h1>
<h2 class="text-center">The man who made Pamplona famous</h2>
<div class="img-thumbnail">
<image src="http://www.ernesthemingwaycollection.com/_themes/hemingway/img/about-hemingway/galleries/02-20141010225753.jpg" alt="Hemingway with a cow" class="img-responsive">
<div class="caption text-center">
Ernest Hemingway laying down next to a cow that is used by bull fighters for training. </div>
</div>
<div>
<h3>Here is a timeline of Ernest Hemingway</h3>
<div>
<ul>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
<li><b>1899</b> - Born in Oak Park, Illinois</li>
</ul>
<p>"Courage is grace under pressure."</p>
<p>- Ernest Hemingway</p>
<div>
<p>If you want to know more about Ernest Hemingway take a look at his <a href="#">wikipedia entry</a>.</p>
</div>
<!-- Figure out how to add the line that crosses tha page on bootstrap -->
<p> Coded by Manuel Martin</p>
</div>
</div>
CSS代码
h1 {
font-size: 60px;
}
h2{
font-size: 33px;
}
.outline{
margin: 70px 70px;
}