[css] rem 단위는 무엇이고, 왜 사용하나

bootstrap을 사용하다 버튼 간격이 안맞아 개발자 도구로 찾아보았다.

번튼간의 간격뿐 아니라 많은 곳에서 rem을 사용하고 있었다. 

 

결론은 화면을 확대, 축소할때 버튼 간격을 px으로 사용한다면

화면을 확대, 축소해도 각 요소(Element)들은 크기가 변하지 않음으로 확대, 축소의 의미가 없을 것이다.

따라서, rem(루트 요소의 글꼴 크기)단위를 사용해야 반응형에서 잘 작동한다.

 

 

개발자 도구로 본 버튼 사이간격, margin-top을  .5rem이라고 주었다.

 

단위에 대한 설명은 

모질라 개발자 사이트: css 값과 단위에 잘 나와있으므로 꼭 참고하자.

 

 

단위 정의>

 

 

 

출처>

모질라 개발자 사이트

css 값 과 단위

https://developer.mozilla.org/ko/docs/Learn/CSS/Building_blocks/Values_and_units

 

영문

https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/Values_and_units

 

 

광고>