반응형 CSS2 CSS 참고 키워드 - 반응형 웹사이트 참고하는 강의를 기준으로는 최근에는 모바일 환경에서 사이트를 더 자주 접속하므로, 우선적으로 모바일 환경에 맞추어 웹사이트를 개발한다. 이후에 데스크탑 같은 환경에 대응하게끔 CSS 코드를 추가하면 된다. 태그로 모바일 환경 대응픽셀 밀도 차이모바일 기기는 해상도는 매우 높지만 물리적인 화면의 크기는 작다. 그렇기 때문에 모바일 브라우저는 웹사이트를 표시할 때 일반적인 데스크톱 화면을 보여주는 것처럼 기본적으로 설정한다. 즉, 모바일 브라우저는 좁은 화면이지만, 넓은 화면을 가정해서 요소들을 배치하기 때문에 웹페이지가 작고 축소된 형태로 욱여 넣어지게 된다.뷰포트와 픽셀이러한 픽셀 밀도 차이 문제를 해결하기 위해 실제 물리적인 픽셀을 모바일 환경에 적절한 비율의 CSS 픽셀로 변환하는 작업이 필요하다.C.. 2024. 9. 25. CSS 참고 키워드 - CSS 요소 CSS를 학습하면서 기억하면 나중에 유용하겠다 싶은 키워드들을 기록한 글이다. 하나하나 상세히 설명을 적기엔 내용이 방대해서 필요하면 직접 검색을 하면서 그때그떄 활용을 하면 좋을 것 같다.올바른 단위 선택하기font-size (root element)%: 브라우저 설정보다 웹 사이트의 기본 폰트 크기를 작게하려면 해당 값을 사용할 수 있다.단위를 사용하지 않는 게 좋다font-sizerem: 루트 요소에 아무런 폰트 크기를 적용하지 않은 경우, rem이 적용된 font-size는 항상 이 루트 요소를 참조한다. em은 자식 요소에 적용하되 연쇄적으로 적용하면 크기 제어가 복잡해진다.padding, marginrem: 만약 요소 사이의 margin을 고정하고 싶다면, 이때는 rem을 적용하지 않아도 된.. 2024. 9. 24. 이전 1 다음 반응형
