텍스트 사이의 여백을 지정하십시오.

웹 사이트의 스타일 가이드를 만들고 싶습니다. 그리고 h1을 가지고 싶습니다. 글자의 꼭대기에서부터 다음 글자의 꼭대기까지 다음 텍스트 앞에 항상 28 픽셀 아래쪽 여백을두고 싶습니다. 다음 글자. 문제는 HTML에서 line-height가 항상 여분의 공백을 추가하고 각 텍스트마다 다를 수 있다는 것입니다. 얼마만큼의 마진을 사용하는지 정확히 아는 규칙이 있습니까? 예를 들어 항상 28px가됩니다.텍스트 사이의 여백을 지정하십시오.

<h1>HL1: Meine Bestellungen</h1> 
<h2>SL1: Bestellnr. 1234563</h2> 


h1 { 
    background: none repeat scroll 0 0 rgb(255, 255, 0); 
    color: rgb(153, 145, 141); 
    font-family: Georgia; 
    font-size: 26px; 
    font-weight: normal; 
    letter-spacing: 0; 
    line-height: 30px; 
    margin-bottom: 28px; 
    text-decoration: none; 
    text-transform: uppercase; 
} 


h2 { 
    background: none repeat scroll 0 0 rgb(0, 255, 0); 
    color: rgb(196, 18, 47); 
    font-family: Lucida Sans; 
    font-size: 12px; 
    font-weight: normal; 
    letter-spacing: 0.1em; 
    line-height: 20px; 
    margin-bottom: 6px; 
    text-decoration: none; 
    text-transform: uppercase; 
}

감사!

출처

2013-08-13 user1937021

당신은'h1'의 기준에서하거나 센더을의에서 이야기하고 있는가? – thgaskell

라인 높이와 아무 관련이 없습니다. 브라우저 기본값과 관련이 있습니다.

예를 들어 Google 크롬 버전에는 기본적으로 h2에 적용된 margin-top 값이 있습니다. 당신은 모든 여백을 지정해야합니다 :는 "CSS 리셋"에

h1 { 
    margin: 0 0 28px; /* shorthand notation */ 
} 
h2 { 
    margin: 0 0 6px; 
}

보고, jsFiddle에서 당신은 "표준화 CSS"옵션을 확인할 수 있습니다.

Reources :

출처

2013-08-13 16:14:29

텍스트 사이의 여백을 지정하십시오.

답변

관련 문제