HTML/CSS에서 단락의 여백을 제거하는 방법

Question

HTML과 CSS에서는 p 태그와 이미지 사이에이 수직 간격이 있습니다. 그것은 다음과 같습니다

는 인사와 이미지 사이의 여분의 수직 공간을 참조하십시오? 어떻게 제거합니까? 안녕하세요. 안녕하세요. 안녕하세요. 안녕하세요. 안녕하세요. 안녕하세요. 안녕하세요. 안녕하세요.

내 코드 :

HTML :

<div class="Box"> 
    <p> hello </p><img class="contextimg" WIDTH="50" HEIGHT="50" SRC="pic.jpg"> 
</div> 

CSS :

.Box       //this is the parent div 
{ 
    background-color:red; 
    width:60px; 
    margin:0px; 
    margin-bottom: 0px; 
    padding:0px; 


} 
.contextimg       //this is for the image 
{ 
    position:relative; 
    margin:0px; 
    padding:0px; 
    line-height:0px; 

} 

참고 : 나는 또한 0으로 신체의 마진과 패딩을 설정하려고하지만하지 않았다했습니다 작업.

Answer 1

브라우저는 단락에 기본 여백을 지정하는 것이 일반적입니다. 그러니 그냥 가져 가세요.

.Box p{ 
    margin: 0; 
} 

은 여기를 확인하십시오 : http://jsfiddle.net/aG27X/p 요소의 기본 패딩/마진의

Answer 2

, 당신은 다시 설정해야합니다

.Box p { 
    margin: 0; 
    padding: 0; 
} 

를 사용해보십시오

는 <p> 0의 여백을 지정

를 사용하는 것보다 빠른 해결책을 원할 경우 웹 페이지를 디자인하기 전에 브라우저 기본값을 사용하십시오.

* { 
    margin: 0; 
    padding: 0; 
} 

당신은 이러한 스타일 시트가 자동으로 0 <p> 태그에 정확하게

Answer 3

<p> 태그의 패딩과 마진 위/아래를 설정, 각 요소를 재설정합니다, CSS 리셋 stylsheets 위해 밖으로 구글 수 있으며, 사용자의 요구에 충분합니다 당신이 뭔가 다른 것에 의해 그것을 덮어 쓰지 않는 경우를 대비하여, 기본 패딩/마진을 설정하십시오.

p { 
    margin: 0; 
    padding: 0; 
} 

Answer 4

p은 단락을 나타냅니다. Fiddle

당신은 다음과 같이 제거 할 수 있습니다 : 다음 paragraph이를 automaticly 같은 공간을 추가 fiddle

Answer 5

나는 당신의 문제가 무엇인지 말할 수는 없지만,이 바이올린에서 : http://jsfiddle.net/u6C9E/

p { margin: 0; padding: 0; } 

공장.

Answer 6

위 또는 아래의 단락 이미지가있는 경우 두 단락으로 단락을 만드십시오.

HTML :

<p> class="first">Your 1st Paragraph</p> 
<p> class="second">Your 2nd Paragraph</p> 

CSS의 :

p.first { 
     text-indent: 2em; 
     margin-bottom: -5%; 
    } 
    p.second { 
     margin-top: -5%; 
     text-indent: 2em; 
    } 

사용 "퍼센트"여전히 반응 형 웹에서 좋은 찾고 있도록 ...