我想删除顶部和底部图像之间的额外空间。我的代码是
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>home</title>
<link rel="stylesheet" href="css/bootstrap.css"/>
<link rel="stylesheet" href="css/bootstrap.min.css"/>
<link rel="stylesheet" href="css/style.css"/>
</head>
<body>
<div class="container">
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
<div class="col-md-3 post-col">
<img src="home-1.jpg" alt="" class="post-image"/>
<div class="col-md-12">
<h5>2 days ago by Admin</h5>
<h4>Post title</h4>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
<p>Post description here Post description herePost description herePost description
herePost description herePost description here</p>
</div>
</div>
</div>
<script src="js/jquery-2.1.1.min.js"></script>
<script src="js/bootstrap.js"></script>
<script src="js/bootstrap.min.js"></script>
</body>
</html>
运行代码后,结果看起来像..
我面临的问题!
如上图所示,顶行第3张图像与第3张图像之间存在较大间隙,但我希望图像低于其他图像,不保留额外空间。
Link显示了我想要的示例示例.....
答案 0 :(得分:-1)
使用砌体将解决问题。