2014-04-20 2 views
1

HTML 코드 불필요한 공간 그것을

<head> 

<meta name="viewport" content="width=device-width, initial-scale=1"> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> 

<link href="css/style.css" rel="stylesheet" type="text/css" media="screen"/> 


<title>abc</title> 

</head> 
<body> 
<div class="wrapper"> 

    <div class="box"><img src="images/roundlogo.jpg" alt=""></div> 
</div> 

</body> 
</html> 

CSS 코드

img{ 
border:0px; 
border-image-width:0px; 
border-image-slice:0px; 

} 
.box 
{ 
width:250px; 
//border:1px solid; 
height:auto; 
border-image-slice:0px; 
border-image-width:0px; 
border-image-outset:0px; 
} 

.box img 
{ 
width:100%; 
//border:1px solid green; 
margin-top:0px; 
} 

난 코드 상부 도시 물품하지만 브라우저를 검사 할 때 영상의 4 픽셀의 공간이 존재 부모 div()라는 상자

여기 내 작품은 jsfiddle입니다 당신이 결과를했다은 iframe을 검사 할 수 있습니다 이 표시됩니다이는 공간이 명확 http://jsfiddle.net/2RqmU/548/

답변

2

IMG는 인라인 요소를 보여줍니다. 추가 공간을 제거하려면 블록 요소로 만들거나 기준선 이외의 수직 정렬을 지정하십시오.

+0

thx 이미지가 인라인 인 경우 이미지와 상위 div 사이에 4px 공간이있는 방법은 무엇입니까? – Susantha7

+0

아아 이제 단어 공간에 속하는 공간이되었습니다. – Susantha7