-
코드스테이츠 백엔드 부트캠프 39기 4일차
Page Layout
CSS를 이용한 레이아웃
CSS로 레이아웃을 설정할 때는, 일반적으로 수직분할(열) → 수평분할(행) 순서로 진행한다.
그리고 간혹 HTML 의 기본 스타일이 레이아웃 설정에 방해가 되기도 한다.
예를 들면 <body>태그가 가지는 약간의 기본 여백, 브라우저마다의 기본 여백이나 글꼴의 차이 등이 있겠다.
해결 방법은 간단하다. 다음의 CSS 코드 몇 줄만 적어주면 된다.
* { box-sizing: border-box; } body { margin: 0; padding: 0; }Flexbox
박스를 유연하게 늘리거나 줄여서 레이아웃을 잡는 혁신적인 기술이다.
부모 박스 요소에 display: flex 를 적용하여 자식 박스의 방향과 크기 등을 결정하는 레이아웃 구성 방법이다.
'CodeStates_Backend > TIL (Today I Learned)' 카테고리의 다른 글
[TIL #6] Linux 기초 (0) 2022.05.02 [TIL #5] HTML, CSS 이용한 웹페이지 구현 / 페어 프로그래밍 (2) 2022.05.02 [TIL #3] HTML, CSS (2) 2022.04.28 [TIL #2] 컴퓨터의 이해, IntelliJ 튜토리얼 (2) 2022.04.27 [TIL #1] 시작! (0) 2022.04.25