Mui Grid
📌 Mui의 xs와 md란?
xs와 md란? 는 Material-UI의 그리드 시스템에서 사용되는 반응형 레이아웃 속성입니다.
- xs: Extra small 화면 크기 (일반적으로
모바일 화면)에서의 그리드 아이템 크기를 지정합니다. - md: Medium 화면 크기 (일반적으로
데스크탑 화면)에서의 그리드 아이템 크기를 지정합니다.
그리드 시스템은 12개의 컬럼으로 나뉘어지며, 각 그리드 아이템은 이 컬럼을 기반으로 크기를 조정합니다. xs와 md 속성을 사용하여 각각의 화면 크기에서 그리드 아이템의 너비를 설정할 수 있습니다.
위의 코드에서는 첫 번째 그리드 아이템은 xs=6, md=8로 설정되어 있으므로, extra small 화면에서는 6개의 컬럼 폭을 차지하고, medium 화면에서는 8개의 컬럼 폭을 차지합니다. 나머지 그리드 아이템도 동일한 방식으로 설정되어 있습니다.
이를 통해 반응형 레이아웃을 적용하여 화면 크기에 따라 그리드 아이템의 크기를 조정할 수 있습니다.
