我被告知，使一个购物车网站使用引导与产品的图像定位在两行，每行三个面板
虽然在这里我只编码了一个面板的图像在它，我面临的主要问题是调整面板的位置总是出现在页面的顶部。
我试着用id posi把它包含在一个div中，然后试着用来定位它，但没有成功，所以请帮助。此外，图像看起来太大了，所以什么是最好的方法来重新调整它的大小，使图像的响应性保持不变。我还有另一个问题，这是写在我的代码片段（作为评论），如果有人知道这个友好的帮助的答案。
<!DOCTYPE HTML>
<html>
<head>
<title>
Web page
</title>
<meta charset="utf-8">
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js"></script>
<style>
#posi
{
position=absolute;
top=100px;
right=50px;
}
</style>
</head>
<body>
<div id="posi">
<div class="container">
<div class="row" >
<div class="col-md-3 col-md-6" ><!--Although I have used this col-md-3 col-md-6 but I also want to know
what happens when we specify two column definitions in a single class like this-->
<div class="panel panel-default" >
<div class="panel-heading panel-primary">
Iphone 6
</div>
<div class="panel-body">
<img src="http://store.storeimages.cdn-apple.com/4711/as-images.apple.com/is/image/AppleInc/aos/published/images/i/ph/iphone6/plus/iphone6-plus-box-gold-2014?wid=478&hei=595&fmt=jpeg&qlt=95&op_sharpen=0&resMode=bicub&op_usm=0.5,0.5,0,0&iccEmbed=0&layer=comp&.v=1411520675923" class="img-responsive" />
</div>
</div>
</div>
</div>
</div>
</div>
</body>
</html>
1条答案
按热度按时间56lgkhnf1#
要使
top生效，您需要设置position。