3. grid（推荐）#

1
.layout {
2
  display: grid;
3
  grid-template-columns: 16rem 1fr;
4
}

语义最清楚，改起来也最方便。

这套布局方式在 Vite 的开发服务器里也用到了（它的 HMR 客户端就靠固定两栏）。

三种写法#

1
.layout {
2
  display: grid;
3
  grid-template-columns: 16rem 1fr;
4
}