div 나 table 에서 img 의 공백 없애기
페이지 정보
본문
* 참고 : https://aboooks.tistory.com/193
이미지는 inline 요소라서, 보이지 않는 라인박스(행박스)를 생성한다.
우선 이 현상은 html5 이전에서는 문제가 되지 않던 것이었다.
그러므로 <!doctype html> 선언을 빼면, 공백이 없어지기는 한다.
하지만, 이 문제 하나만으로 표준이라 할 수 있는 doctype 선언을 빼는 것은 좀 그렇다.
ㅇ 해결방법으로는,
인라인 요소인 img 를 블록 요소로 만들어 주면 된다.
<style>
img {display:block;}
</style>
ㅇ 문제점
위 방법으로 모든 img 를 블록 요소로 만들어 버리면,
한 요소 안에서 가로로 나열한 이미지들이 있는 경우, 모두 행이 바껴 버린다. ㅠㅠ
결국 하나하나 해결할 수 밖에 없을 듯 하다.
이미지는 inline 요소라서, 보이지 않는 라인박스(행박스)를 생성한다.
우선 이 현상은 html5 이전에서는 문제가 되지 않던 것이었다.
그러므로 <!doctype html> 선언을 빼면, 공백이 없어지기는 한다.
하지만, 이 문제 하나만으로 표준이라 할 수 있는 doctype 선언을 빼는 것은 좀 그렇다.
ㅇ 해결방법으로는,
인라인 요소인 img 를 블록 요소로 만들어 주면 된다.
<style>
img {display:block;}
</style>
ㅇ 문제점
위 방법으로 모든 img 를 블록 요소로 만들어 버리면,
한 요소 안에서 가로로 나열한 이미지들이 있는 경우, 모두 행이 바껴 버린다. ㅠㅠ
결국 하나하나 해결할 수 밖에 없을 듯 하다.
추천0
댓글목록
등록된 댓글이 없습니다.
8
3
공공데이터포털 OpenAPI
