여백과 여백이 0임에도 불구하고 내 이미지와 Div 테두리 사이에 간격이 있는 이유는 무엇입니까?

고정 요소 변위

코드에는 테두리가 있는 div 내에 포함된 이미지를 둘러싸는 앵커 태그가 있습니다. 여백과 패딩을 모두 0으로 설정했음에도 불구하고 이미지와 div 테두리 사이에 약 3픽셀의 지속적인 간격이 발생합니다.

근본 원인: 인라인 디스플레이

이러한 불일치의 근본 원인은 이미지 요소의 인라인 표시에 있습니다. 인라인으로 표시되면 이미지는 텍스트 내의 문자와 유사하게 작동합니다. 결과적으로 "j", "g", "y" 및 "p"와 같은 문자에서 발견되는 것과 같은 디센더를 수용하는 기준선에 배치됩니다.

해상도: 수직 조정 정렬

이 불필요한 공간을 제거하려면 CSS를 사용하여 이미지의 수직 정렬을 조정할 수 있습니다. 스타일 규칙 "img {vertical-align: Bottom}"을 적용하면 이미지가 줄 하단에 정렬되어 이미지와 div 테두리 사이의 간격이 제거됩니다.

위 내용은 여백과 여백이 0임에도 불구하고 내 이미지와 Div 테두리 사이에 간격이 있는 이유는 무엇입니까?의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!