> For the complete documentation index, see [llms.txt](https://yamoo9.gitbook.io/css-grid/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://yamoo9.gitbook.io/css-grid/css-grid-term.md).

# 한 눈에 살펴보는 Grid 용어

## Grid

그리드 컨테이너(Container)는 행(Rows)과 열(Columns)을 가지며, 그리드 아이템(Items)을 배치할 수 있습니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5fZWVTqFDi6AV1QNB%2Fimage.png?alt=media\&token=9890257b-f37b-45a5-97ef-8f92820ca82e)

## Grid Line

그리드의 행/열을 그리는 선을 말하며, 각 선은 라인 넘버를 갖습니다. 그리드 아이템을 배치하는 기준으로 사용됩니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5fxvo4g7OuwZzrtOr%2Fimage.png?alt=media\&token=e5e56b1f-069d-4afa-85b7-1e09c35464ac)

## Grid Track

그리드 트랙은 그리드 라인 사이의 행 또는 열 공간을 말합니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5gamyhf0sbD-G4tEd%2Fimage.png?alt=media\&token=60f48d68-e1a7-4b86-9914-294bbe23af01)

## Grid Cell

그리드 셀은 4개의 그리드 라인이 묶여 그려지는 가장 작은 단위(유닛) 입니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5h-koK_m6l0qbJi4j%2Fimage.png?alt=media\&token=3dfb5ec6-ccff-4065-8865-046cc7105d5a)

## Grid Area

그리드 에어리어는 그리드 유닛이 묶인 영역으로 고유한 식별자를 가지며, 식별자를 통해 요소를 배치할 수 있습니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5hFMnic7JcLjnkbDu%2Fimage.png?alt=media\&token=5e3e5bd3-9c0d-4b42-b7e3-e64c6b88c733)

## Grid Gutters

그리드 거터는 행 또는 열 사이 간격(Gap)을 말합니다.

![](https://3440753900-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-LH1dN99ZXtZTFG_0JKV%2F-LH5dU3TZ9KBFb0v9kxv%2F-LH5hhSfagawJ5cHRM8P%2Fimage.png?alt=media\&token=a648c912-7f99-42f8-8b77-239f2d640b58)

## 요약 <a href="#summary" id="summary"></a>

| **용어**       | **설명**                  | **비고**              |
| ------------ | ----------------------- | ------------------- |
| Grid         | 그리드 컨테이너 요소             | 자식요소를 그리드 아이템으로 설정  |
| Grid Line    | 그리드를 구성하는 수직/수평 선       | 라인 넘버를 토대로 아이템 배치   |
| Grid Track   | 그리드 라인 사이의 행 또는 열       |                     |
| Grid Cell    | 4개의 그리드 라인(사각형)으로 작은 단위 | '유닛'이라고도 불림         |
| Grid Area    | 그리드 셀이 묶인 영역            | 고유한 식별자를 토대로 아이템 배치 |
| Grid Gutters | 컬럼/로우 사이 간격             |                     |

{% embed url="<https://codepen.io/yamoo9/full/odgNQj>" %}