我想把一些图片放到我的背景div中。
我预计这5个图像文件将在“.well”类的div中,但它们只是从那个div中传播开来。所以,这是我的问题。
如何将这些图像文件稳定地放入 .well div?
我的代码和结果如下:
<!doctype html>
<html ng-app="exampleApp">
<head>
<script src="angular.js"></script>
<link href="bootstrap.css" rel="stylesheet"></link>
<link href="bootstrap-theme.css" rel="stylesheet"></link>
<script>
angular.module("exampleApp", [])
.controller("exampleCtrl", function($scope){
$scope.data = [
{ movie:"Pandora", date:"2016-12-07", img:"pandora.gif" },
{ movie:"Lalaland", date:"2016-12-07", img:"lalaland.gif" },
{ movie:"Willyoubethere", date:"2016-12-14", img:"willYouBeThere.gif" },
{ movie:"brother", date:"2016-11-23", img:"brother.gif" },
{ movie:"Animal", date:"2016-11-16", img:"fantasticAnimalDictionary.gif" }
];
});
</script>
</head>
<body ng-controller="exampleCtrl">
<div class="container">
<div class="well">
<div class="col-md-2" ng-repeat="data in data">
<img ng-src={{data.img}} />
</div>
</div>
</div>
</body>
</html>
答案 0 :(得分:1)
使用row
添加well
课程。像这样
<div class="well row">
<div class="col-md-2" ng-repeat="data in data">
<img ng-src={{data.img}} />
</div>
</div>
row
类是列的容器。行为列提供了一个存放的位置,理想情况下具有最多为12的列。它还充当包装器,因为所有列都向左浮动,其他行不在当花车变得怪异时,它会重叠。