下面将创建200个像素的列，以适应容器。
grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
但是，我不能理解1fr部分。这意味着1个分数。但是，auto-fill的情况如何？
这些列是使用repeat((函数定义的，最小宽度为200px，最大宽度设置为1fr，这样它们就可以扩展并平等共享任何可用的额外空间。至于每行的列数，我们将使用自动放置关键字，这样我们就可以让浏览器负责网格的响应，并在需要时将列包装成新行。
浏览器将使用auto-fill关键字放置第一个示例中的列并调整其大小。-从此网站https://css-tricks.com/