html - 仅为 ul 的第一个和第二个子节点定义网格的 fr

Question

我正在使用 ul li 为网站创建导航。目前有7个链接。我已将 ul 的显示设置为带有 repeat(7,1fr) 的网格。但是我希望第一个和第二个 li 为 .5fr 和 1.5fr。我该怎么做？

nav ul {
  display:grid;
  grid-template-columns: repeat(7,1fr);
}

我想要的样子。

nav ul{
  display:grid;
  grid-template-columns: .5fr 1.5fr 1fr 1fr 1fr 1fr 1fr;
}

Answer 1

你可以这样做:

nav ul{
  display:grid;
  grid-template-columns: .5fr 1.5fr repeat(5, 1fr);
}

这里没有技巧，它工作正常