이미지를 둘러싸고 있는 div에 맞게 확장시켜 div에 꽉 차게 하고 싶은 경우가 있을 수 있습니다. 이런 경우 몇 가지 방법을 사용할 수 있습니다.
<div class="selector"> <img src="path.extension" alt="alt 텍스트"> <!-- 컨텐츠 --> </div>
HTML이 위와 같은 경우 다음과 같은 CSS 코드를 사용하면 이미지가 비율에 관계없어 늘어나서 div를 채우게 됩니다.
.selector img{
position: absolute; top:0; left: 0;
width: 100%;
height: 100%;
}jQuery를 사용할 수도 있습니다.
$('.selector img').each(function(){
$(this).css({
"left": "50%",
"margin-left": "-"+( $(this).width()/2 )+"px",
"top": "50%",
"margin-top": "-"+( $(this).height()/2 )+"px"
});
});이외에도 다음 글에 여러 가지 방법이 제시되어 있으니 참고하시기 바랍니다.