陕西高速集团西宝分公司三桥管理所党支部品牌建

百度 只有深入生活、扎根人民，在实践中仰观俯察、日积月累，从中找寻典型人物和典型事件，并通过用心、恰当的艺术加工，创作出思想精深、艺术精湛、制作精良的好作品，才能真正赢得观众，收获口碑与市场的双赢。

A grid track is the space between two adjacent grid lines. They are defined in the explicit grid by using the grid-template-columns and grid-template-rows properties or the shorthand grid or grid-template properties. Tracks are also created in the implicit grid by positioning a grid item outside of the tracks created in the explicit grid.

The image below shows the first row track on a grid.

Diagram showing a grid track.

Track sizing in the explicit grid

When defining grid tracks using grid-template-columns and grid-template-rows you may use any length unit, and also the flex unit, fr which indicates a portion of the available space in the grid container.

Example

The example below demonstrates a grid with three column tracks, one of 200 pixels, the second of 1fr, the third of 3fr. Once the 200 pixels has been subtracted from the space available in the grid container, the remaining space is divided by 4. One part is given to column 2, 3 parts to column 3.

css
.wrapper {
  display: grid;
  grid-template-columns: 200px 1fr 3fr;
}
html
<div class="wrapper">
  <div>One</div>
  <div>Two</div>
  <div>Three</div>
  <div>Four</div>
  <div>Five</div>
</div>

Track sizing in the implicit grid

Tracks created in the implicit grid are auto-sized by default, however you can define a size for these tracks using the grid-auto-rows and grid-auto-columns properties.

See also