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

Question

我正在使用 ul li 为网站创建导航。目前有 7 个链接。我已使用 repeat(7,1fr) 将 ul 的显示设置为网格。不过，我希望第一个和第二个 li 分别为 0.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);
}

这里没有什么技巧，它工作得很好