전체 글

[CSS] 반응형 웹사이트 란 무엇인가 ( Feat. 적응형 웹 사이트 )

반응형 웹 사이트 vs 적응형 웹 사이트 최근 10년간 모바일 유저는 계속 증가해서 현재는 모바일 시장이 PC 웹 시장의 2배 가까이 되는 규모까지 증가했다. 지금 우리가 사용하는 웹 사이트를 모바일에 크기까지 그대로 옮기면 사용하는 사람은 아무도 없을것이다. 그래서 모바일 유저들의 접근성을 늘리기 위해 사용하는 방법으로, 반응형 웹과 적응형 웹을 주로 사용한다. 이 두개를 간단하게 소개해볼까한다. 반응형 웹 사이트 반응형 웹 사이트는 웹 페이지의 디자인과 레이아웃이 전부 화면 크기에 자동으로 맞춰지는 웹을 의미한다. 하나의 템플릿이 크기가 늘었다 줄었다 하면서 적응되면서 다른 도메인으로 변경되지 않고 계속 같은 화면에서 진행되는 웹을 의미한다. 인스타그램이 가장 대표적인 예시라고 할 수 있다. 그렇다면..

[HTML/CSS] px, em, rem, vw, vh 에 대하여

용어 정리 px ( pixel ) : 픽셀 em ( element ) : 엘리멘트 rem ( root - element ) : 루트 엘리멘트 vw ( Viewport Width ) : 뷰포트 길이 vh ( Viewport Height ) : 뷰포트 높이 절대 길이 단위 px px 는 고정 값을 쓰는 절대 길이 단위이다. 특정 뷰가 늘어나건 줄어들건에 관계없이 지정한 사이즈를 계속 보여준다 참고로 96px 는 1 인치라고 한다. 상대 길이 단위 em, rem, vw, vh 는 상대 길이 단위이다. em, rem em 과 rem 은 폰트에 비례한 크기로 em은 element 의 폰트 사이즈, rem은 root 의 element 사이즈이다. em, rem 둘다 디폴트 값은 16px 이다. rem em 라고 했..

코드트리 연탄 기부 이벤트 참여

https://www.codetree.ai/christmas 산타의 은밀한 연탄배달 코딩으로 따스함을 선물하세요🎁 www.codetree.ai 코드 트리에서 하는 이벤트 코테에 참여했습니다. 저는 총 3문제 풀었습니다. 오랫만에 풀어서 그런가 많이 풀지는 못했지만, 다음엔 더 열심히 풀어서 전부 풀어보는걸 목표로 하겠습니다.