작심삼일 개발이야기

px은 CSS에서 가장 기본적인 단위이다. px를 사용하여 크기를 설정하면 그 크기는 절댓값이 되어버린다. 하지만 웹 페이지 사이즈의 변동이 많아 크기가 고정되어 버리면 접근성에 안 좋아질 수 있다. 보통 웹 브라우저의 기본 폰트 사이즈는 16px로 설정되어 있으며 일부 웹 브라우저는 기본 폰트 사이즈를 확대하는 기능을 제공한다. 기본 폰트 사이즈를 확대 하더라도 px로 설정되어 있는 폰트 사이즈는 변함이 없다. (ctrl + 휠 키를 사용한 화면 확대는 화면 전체를 확대하는 것이라 가능하다.) rem을 사용하게 된다면 좋은 점 웹 브라우저 마다 다른 기본 폰트 사이즈에 대응할 수 있다. 저시력자 접근성에 대응할 수 있다. rem을 사용하게 된다면 html의 폰트 사이즈를 기준으로 폰트 사이즈를 계산하게..

overflow: overlay라는 속성에 대해 새롭게 알게 되어서 다른 속성들까지 간단하게 정리해보았다. 기본 css 설정 이미지를 기준으로 설명하려고 한다. overflow속성을 따로 지정한 것은 없다. overflow: scroll 항상 스크롤바를 생성하기 때문에 내용의 변화에 따라 스크롤바를 생성하거나 사라지게 하지 않는다. 콘텐츠 내용이 지정한 크기보다 넘치지 않은 경우에도 위의 사진과 같이 무조건 스크롤이 생성되는 것을 확인할 수 있다. overflow: auto 컨텐츠가 요소 안에 들어간다면 visible과 같아 보이나 데스크톱 브라우저의 경우 콘텐츠가 넘칠 때 스크롤바를 생성한다. 같은 overflow: auto를 적용했는데 height의 값에 따라서 스크롤이 자동으로 생성되는 것을 확인할..