배경 이미지 채우기

[ div 중앙 배치하기 ]

 

상황. 12개의 버튼들이 왼쪽으로 치우쳐져 있음

background-color를 지정해서

어디서부터 시작되는지 확인해본다.

 

12개의 버튼을 담고 있는 div 태그가

왼쪽부터 시작하고 있다.

 

버튼을 담는 div 태그를 어떻게 가운데로 둘까?

이 태그의 가로 너비가 1200px

이외에도 나머지 영역이 존재하기에

1200px 짜리 영역이 가운데로 못 간다.

 

 

 

div 너비 이외의 나머지 영역을 왼쪽과 오른쪽을 동등하게 가져라

 

// margin 값을 동일하게 가져라

margin: auto;

 

[ 요소의 배경 이미지 ]

1.background-image : url ('링크');

링크를 지정해줘도 아무런 변화가 없다!

background-color:white 가 지정이 되어있기 때문에 추가적인 setting 필요하다.

2.background-size : cover;

3.background-position : center;

**

어떤 영역에 특정 이미지를 백그라운드에 꽉 차게 넣고 싶다면

3가지 속성을 세트로 지정해!!!!!

**

상황. 12개의 버튼에 같은 배경 이미지가 삽입되었다.

>> ‘누구를’이 명확하지 않다!

 

12가지의 다른 이미지 적용하기 위해서는

rtans밑에 a태그 각각에게 명찰(class)을 부여해주고

각각 다른 background-image를 적용한다.

 

#단축키

전체 코드 (Ctrl + A) -> 자동정렬 ( Ctrl + k + f )