如何使用JS更改grid-template-columns样式？

Question

这是我要在CSS文件中更改的类。

.screen{
margin-top: 0%;
 width: 75%;
 height: 75%;
 background-color: lightgrey;
 display: grid;
 grid-template-columns: repeat(16, 1fr);
 grid-template-rows: repeat(16, 1fr);
}

我分配了一个大小变量，然后假设我可以使用类似的东西：

document.getElementsByClassName('screen').style = "grid-template-columns: repeat(" + size + ", 1fr)"

但无法使其正常工作。 ：（

Answer 1

这是因为document.getElementsByClassName('screen')返回一个数组，因此请尝试使用此

document.getElementsByClassName('screen')[0].style