[TIL]12.26

스타일드 컴포넌트를 사용하여 반응형 UI를 만드는 방법에 대해서 번역을 해보았다. 

 

크기마다 각각의 breackpoint를 준다.

• 최대 크기 768px 화면은 **xs**
• 최대 크기 992px 은 **sm**
• 최대 크기 1200 은 **md**
• 저것 보다 큰 모든것은 **lg**

만약 우리가 column의 범위를 md 6으로 설정했자면 당신은 기기 에서 ```javascript width: 50%;```를 얻을 것이다. 만약 당신이 screen의 너비가 992px를 초과하고 md의 column 범위를 설정하지 않는다면 우리는 너비를 설정하지 않을 것이다. 이 방법으로 column은 항상 다음으로 작은 열 범위의 너비를 가지거나 아무것도 설정 되지 않은 경우 100%가 된다.