div 안에 img 태그가 있을 때는 이미지 파일 자체의 크기가 있기 때문에 div 크기를 아무리 조정해도 크기가 그대로일 수 있다.
그럴 때는 img 태그 css 스타일을
👉 width: 100;
👉 height: auto;
로 설정하자!
(자주 쓰는 설정이다)
2월 8일에 추가한 내용:
css 위쪽에 기본 세팅으로
img {
max-width: 100%;
display: block;
}
이렇게 해 놓으면 좋다.
display: block; 설정하면 이미지 주변에 있는 미세하게 안 맞는 공백을 없앨 수 있다. 이미지 관련된 대부분의 스타일 문제는 이 설정으로 해결할 수 있다.
✨