css 是否可以在flex中多次重复一个div?

fcwjkofz  于 2023-02-01  发布在  其他
关注(0)|答案(1)|浏览(154)

我正在尝试在一个房子上创建一些Windows,这个房子有30个Windows。我想知道是否有可能只使用一个div并重复创建它?

ymdaylpp

ymdaylpp1#

早上好!只有CSS你不能使它通用。CSS结合JS将帮助你存档这个目标。看看下面的例子:

const h = document.querySelector('.h');
const wc = 30;

for(let i = 0; i < wc; i++) {
  const w = document.createElement('div');
  
  h.append(w);
}
.h {
  background-color: brown;
  display: flex;
  gap: 10px;
  width: 500px;
  flex-wrap: wrap;
  padding:10px;
}
.h div {
  background-color: lightblue;
  height: 50px;
  width: 50px;
}

.h div:after {
  content: ' ';
}
<div class="h"></div>

相关问题