主页 / 问题 / 962500
Accepted
Виталий Шебаниц
Asked:2020-03-28 17:57:10 +0800 CST2020-03-28 17:57:10 +0800 CST

无法正确获取块

  • 772

现在是这样的：

在此处输入图像描述

需要这样：

在此处输入图像描述

像这样的代码：

<div class="container-fluid h-100">
  <div class="row h-100">
    <div class="col-3 h-100">
      <div class="row h-15 my-3 justify-content-center" *ngFor="let el of elements;let ind = index;"
        [ngClass]="{'table-primary': currentItemGroup-1 === ind}">
        <div class="col h-100 text-center">
          <img src="{{el.src}}" height="80%" width="auto" alt="">
          <div class="h5">{{el.title}}</div>
        </div>
      </div>
    </div>
    <div class="col-9 h-25 my-4">
      <div class="div h-auto" *ngFor="let item of elements;let ind2 = index;">
        <div *ngIf="currentItemGroup-1 === ind2" class="h-100">
          <div class="ml-2 h-100 row" *ngFor="let i of item.items; let num = index">
            <div class="col-4 text-center h-100" *ngIf='num<4'>
              <img src="{{i.src}}" alt="" height="auto" width="100%"
                style="max-height:90%; max-width: 180px; min-width: 40px;">
              <div style="height: 10%">{{i.title}}</div>
            </div>
            <div class="col-4 offset-3 text-center h-100" *ngIf='num>=4 && num<8'>
              <img src="{{i.src}}" alt="" height="auto" width="100%"
                style="max-height:90%; max-width: 180px; min-width: 40px;">
              <div style="height: 10%">{{i.title}}</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

我不知道怎么捡起来。

вёрстка

1 个回答

  1. Best Answer
    <div class="container-fluid h-100">
  <div class="row h-100">
    <div class="col-3 h-100">
      <div class="row h-15 my-3 justify-content-center" *ngFor="let el of elements;let ind = index;"
        [ngClass]="{'table-primary': currentItemGroup-1 === ind}">
        <div class="col h-100 text-center">
          <img src="{{el.src}}" height="80%" width="auto" alt="">
          <div class="h5">{{el.title}}</div>
        </div>
      </div>
    </div>
    <div class="col-9">
      <div *ngFor="let item of elements;let ind2 = index;" class="">
        <div *ngIf="currentItemGroup-1 === ind2" class="row">
          <div class="col">
            <div *ngFor="let i of item.items; let num = index">

              <div class="text-center" *ngIf='num<4'>
                <img src="{{i.src}}" alt="" width="100%" height="auto" style="max-height:22vh; max-width: 11vw;">
                <div class="div">{{i.title}}</div>
              </div>

            </div>
          </div>
          <div class="col">
            <div *ngFor="let i of item.items; let num = index">
              <div class="text-center" *ngIf='num>=4 && num<8'>
                  <img src="{{i.src}}" alt="" width="100%" height="auto" style="max-height:22vh; max-width: 11vw;">
                <div class="div">{{i.title}}</div>
              </div>
            </div>
          </div>
          <div class="col">
            <div *ngFor="let i of item.items; let num = index">
              <div class="text-center" *ngIf='num>=8'>
                  <img src="{{i.src}}" alt="" width="100%" height="auto" style="max-height:22vh; max-width: 11vw;">
                  <div class="div">{{i.title}}</div>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
    • 0

相关问题