课程: CSS: Advanced Layouts with Grid

免费学习该课程！

今天就开通帐号，24,700 门业界名师课程任您挑！

Named grid lines

Named grid lines - CSS教程

课程: CSS: Advanced Layouts with Grid

开始一个月试用 购买团队方案

Named grid lines

“

- [Instructor] Named grid areas aren't the only alternative to using grid line numbers to place grid items. We can also name grid lines, and we do that using the grid-template-columns and grid-template-rows properties on the grid container. In this example, we're using grid-template-columns to specify the size of each vertical track in the grid, and we're doing the same for our horizontal tracks with this grid-template-rows. And then, we're placing items on the grid using line numbers. Now, these line numbers, you can imagine your grid lines being on either side of these defined tracks. So, there's the first grid line at the left edge of this first grid track. We have the second grid line after that, one after this 1fr, and finally, a grid line at the end. And if we want to name these lines, we can do that inside square brackets here in this track listing. An important thing to remember here is that we're naming the line, not the track that comes after it. So once we name the lines…

内容