css - angular js中的自动完成搜索栏

Question

我正在尝试使 div 中的 img 响应。我还希望图像连续显示 3 个以获得最大屏幕尺寸。

index.html

.container {
border: 1px solid #333;
border-radius: 8px;
background-color: #fff;
margin:5px;
padding:5px;
height:auto;
width:auto;    
}

img {
  max-height: auto;
  max-width: auto;
}

<div class="container">
        <div class="col-sm-4"  ng-repeat="hbl in hbls"></div>
           <a href ng-repeat="h in hbl.data_list"><img ng-src="{{h.img}}" 
                 alt="" >
                  {{n.name}} </a>
        </div>
     </div>

Answer 1

1. 你有不必要的</div>
2. 如果你想要for maximum screen size你必须设置 col-lg-4 和不 col-sm-4因为sm适用于最小屏幕尺寸，不是最大

.container {
border: 1px solid #333;
border-radius: 8px;
background-color: #fff;
margin:5px;
padding:5px;
height:auto;
width:auto;    
}

img {
  max-height: auto;
  max-width: auto;
}

<div class="container">
        <div class="col-lg-4"  ng-repeat="hbl in hbls"></div>
           <a href ng-repeat="h in hbl.data_list">
           <img src="https://material.angular.io/assets/img/examples/shiba1.jpg" 
                 alt="" >
                  Name</a>
</div>