수복의 프로그래밍 여행기
article thumbnail
Natours Project — Header 구축 (Part 2)
Advanced CSS 2019. 1. 1. 20:18

이번 강좌에서는 아래와 같은 기능을 추가하려고 합니다.로고 붙이기제목 추가하기먼저 로고를 불러와서 원하는 위치에 놓는 법 부터 해보겠습니다.Div tag 추가 및 클래스 이름 설정- 이 안에 이미지를 넣을 예정img tag 추가, 클래스 이름 설정 및 src 를 이용하여 로고를 가져오고 alt 속성과 클래스 이름 설정CSS 안에서 해당 클래스에 position 설정첫 번째로 div tag를 추가 하여 이미지를 넣을 것입니다. 그 이유는 이미지가 인라인 요소이기 때문에 height 와 width가 적용이 되지 않습니다. 그래서 이미지가 들어갈 작은 컨테이너 (div) 를 만들고 그 안에 위치를 정하면 로고가 해당 위치로 움직이게 됩니다. 그리고 컨테이너에 클래스 이름을 넣습니다. 갑자기 인라인 요소라는게 ..