줄 높이 및 맞춤 문제가 있습니다.

Question

요소가 하나 이상 있으므로 가능한 한 줄 높이> 1로 설정해야합니다. 그렇지 않으면 엉망으로 보입니다. 하지만 그렇게하면 선이 텍스트보다 높아지고 텍스트가 가운데에 배치됩니다. 그래서 그것은 상단과 일치하지 않습니다. 어떻게하면 텍스트의 위치를 ​​줄 맨 위로 바꿀 수 있습니까? 아니면 두 줄 사이에 간격을 두는 다른 방법이 있습니까?

Answer 1

줄의 높이가 정의에 따라 지정된 줄 높이 내에서 글꼴 크기를 가운데에 맞 춥니 다. 12 픽셀 글꼴과 16 픽셀 라인 높이가있는 경우 텍스트는 16 픽셀 내에 가운데에 표시되며 상단 및 하단 모두에 2 픽셀이 남습니다.

<style type="text/css"> 
.spacer 
{ 
line-height:1px; 
} 

.spacer:after 
{ 
content:"."; 
visibility:invisible; 
line-height:1px; 
} 
</style> 

당신은 할 수 있습니다

float: left; 
margin-top: -2px; 

Answer 2

이 시도 : 행 높이를 유지하는 요소에 부정적인 마진을 추가하고 부정적으로 그것을 밀어 동안

하나 개의 솔루션이 텍스트를 밀어 위의 CSS 코드에서 줄 높이를 높이고 다음과 같이 사용하십시오.

your line one 
<p class="spacer"></p> 
your line two