css 1fr

css 1fr

"css 1fr" 是CSS中的一个属性值，用于定义一个grid容器中一个grid轨道的大小。

在CSS Grid布局中，fr是一个分数单位，表示可用空间的一部分。当使用1fr时，表示这个grid轨道占用其它可用空间的1等分。

以下是一个示例代码，展示了如何使用1fr来定义一个grid容器中的轨道大小：

.grid-container {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr; /* 三个grid轨道，每个轨道占用可用空间的1等分 */
}
 
.grid-item {
  /* 样式规则 */
}

在上述代码中，一个名为.grid-container的元素被定义为grid容器，并且使用grid-template-columns属性来设置grid容器中grid轨道的大小。该属性的值为"1fr 1fr 1fr"，表示容器中有三个轨道，每个轨道占用可用空间的1等分。

你也可以根据需要调整轨道的数量和大小，例如： "2fr 1fr" 表示第一个轨道占用可用空间的两等分，第二个轨道占用可用空间的一等分。