4일차 코딩 - 이미지 및 여백주기
1. 이미지 삽입하기 - img 태그
- img 태그 입력 방법
- <img src=”” art=””>
- img 태그에는 기본적으로 두 가지 속성 src, alt 가 생성된다.
- src 는 이미지의 링크를 삽입하여 이미지를 삽입한다.
- art 는 이미지가 어떤 잘못으로 인해 나오지 않을 경우 ‘이미지 로딩 실패’ 등으로 사용자에게 보여줄 메세지를 표시한다.
- img 태그는 단일 태그로 자식을 가질 수 없다.
- img 태그의 기본 display 값은 inline-block 이다.

img 태그 사용 된 모습

링크 오삽입으로 alt 의 오류 메세지가 나오는 모습

- 이미지에 넓이를 지정 하는 것 보다는 부모 태그로 감싼 후에 부모 태그의 넓이를 지정 한 후 이미지 넓이 값은 100%로 해서 조정 하는 것 이 좋다

- lorem + tab 아무 글자 만들기 → 왜 쓰는건지 모르겠는데 찾아봐야함
2. 여백주기 - margin, padding
- margin : 바깥쪽 여백 주기
- top left bottom right 등 사용
- margin : 50px 50px 12px 30px; ⇒ top 방향부터 시계방향 적용 (top→right → bottom → left)
- margin : 50px 80px; ⇒ 상하 50 / 좌우 80 적용