Показать изображения в определенной сетке: ejs - PullRequest
Новая
       7

Показать изображения в определенной сетке: ejs

0 голосов
/ 13 сентября 2018 
  <div class="row">
      <% for(var i=0; i < sImages.length; i++) { %>
      <img src="http://12.18.11.52:8980/public/uploads/<%=sImages[i]%>" class="img-thumbnail" alt="Cinque Terre"
        style="display: block;float: left;margin-right: 5px;">
      <% } %>
  </div>

это то, что у меня есть в моем шаблоне ejs. Я генерирую PDF из этого шаблона, и я хочу, чтобы изображения были изменены на 33,33% и макеты сетки, как 3 изображения в первом ряду и 2 изображения во втором ряду. будет не более 5 изображений. Я пробовал некоторые приемы CSS, но не работал

1 Ответ

0 голосов
/ 13 сентября 2018

Есть много решений для достижения этого макета, здесь два простых способа, как показано ниже: 

<div class="row">
  <% for(var i=0; i < sImages.length; i++) { %>
  <img src="http://12.18.11.52:8980/public/uploads/<%=sImages[i]%>" class="img-thumbnail" alt="Cinque Terre"
    style="display: block;float: left;margin-right: 5px;width: calc(33.3333% - 5px);">
  <% } %>
</div>

или 

<div class="row">
  <% for(var i=0; i < sImages.length; i++) { %>
  <img src="http://12.18.11.52:8980/public/uploads/<%=sImages[i]%>" class="img-thumbnail" alt="Cinque Terre"
    style="display: block;float: left;margin-right: 2%;width: 31.3333%;">
  <% } %>
</div>
...