主页 / 问题 / 1012295
Accepted
Vova Makarovych
Asked:2020-08-11 14:58:46 +0000 UTC2020-08-11 14:58:46 +0000 UTC

我需要适应 20 x 20 编号的单元格

  • 772

我需要放置 20 x 20 编号的单元格。像这样的东西 1 1 2 3 4 5 2 1 2 3 4 5 3 1 2 3 4 5 4 1 2 3 4 5

等等。您如何建议在 Angular 中执行此操作。不做简单的枚举。PS并且那里的单元格应该靠近数字。我认为增加或减少数量。

css3

1 个回答

  1. Best Answer

    这可以通过 CSS 来完成，counter(). 并且这些块不必是基本的，它们可以是仅用于数字的小块。有条件的像这样：

    .mama {
  counter-reset: bubu;
  counter-increment: mama;  
  /****/ border: 2px solid orange; margin: 10px;
}
.mama::before {
  content: counter( mama ) "→ ";
  /****/ font-size: 30px; color: red;
}

.bubu {
  counter-increment: bubu;  
  /****/ border: 1px solid #05a; display: inline-block; margin: 15px 5px 0 0; width: 50px;
}

.bubu::before {
  content: counter( bubu ) ". ";
}
    <div class="mama">
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
</div>

<div class="mama">
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
</div>

<div class="mama">
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
</div>

<div class="mama">
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
  <div class="bubu"></div>
</div>

    • 1

相关问题