"사이트에 이미지를 넣는 방법은 두 가지가 있습니다.
<img>태그를 사용하는 것과 <div> 태그에 background-image 속성을 추가하는 것두 가지 방법의 차이점과 각각 어떠한 경우에 사용하면 좋을까?"
둘의 기능적인 의미가 다르다. div의 경우 자신의 의미를 지니고 있지 않는 non-sematic 태그이며 img 같은 경우 여러 조건들과 속성에 의미를 주는 sematic 태그이기 때문이다
div는 아무런 의미 없는 기능적인 역할이다.
하지만 img태그는 자신만의 의미가 있다. '이미지를 불러와라 실패하면 어떤 문구를 사용자에게 출력해라'라는 자신만의 의미가 있다.
하지만 div에 background-image를 통해 이미지를 삽입하면 이미지 자체의 자신의 의미가 없기 때문에 div안에 속할수 밖에 없다. 결과적으로 div에게 여러 값을 줘 이미지를 맞추는 방법 밖에 없다. 가독성의 부분에서는 img 파일을 사용하는 것이 좋겠지만, 만약 특정 block 안에 이미지를 삽입하고 싶다면 div에 background-image 삽입을 하여도 괜찮은 방법일 듯 싶다.
Venire, Videre, Vincere