[SH FILM/CSS] 이미지 가운데 정렬

background-color는 영역 구분을 위한 것일 뿐, 원래는 다 white임

나름 10분 고민해서 만든 내 간지나는 로고 이미지를 야심차게 넣었건만

난 이 로고를 가운데에 배치하고 싶다.

---

이미지를 가운데로 정렬하고 싶으면 display 속성을 사용하면 된다.

 

1. display 속성 사용

display의 블록레벨 속성을 사용하고 margin을 auto값으로 지정해주면 이미지가 가운데로 정렬됨

.main_logo{
    display: block;
    margin: auto;
}

쫘좐

 

display 속성에 block 요소를 넣어주면 언제나 새로운 line에서 시작한다.

대표적으로 <div>, <h1> 등이 있음

 

쉽게 말하면 웹페이지 기준 가로 한 줄을 모두 차지하게 되는 것이다.