줄 간격 설정
MS Word에서 설정할 수있는 것처럼 CSS로 줄 간격을 설정하는 방법은 무엇입니까?
선 높이 속성을 사용해보십시오 .
예를 들어, 12px 글꼴 크기와 4px는 아래쪽과 위쪽 줄에서 떨어져 있습니다.
line-height: 20px; /* 4px +12px + 4px */
또는 em
단위
line-height: 1.7em; /* 1em = 12px in this case. 20/12 == 1.666666 */
라인 수인 단위가없는 값을 사용할 수도 있습니다. line-height: 2;
이중 간격, line-height: 1.5;
1 등 반 등입니다.
압축 된 선을 원하면 font-size
및에 대해 동일한 값을 설정할 수 있습니다line-height
CSS 파일에서
.condensedlines {
font-size: 10pt;
line-height: 10pt; /* try also a bit smaller line-height */
}
HTML 파일에서
<p class="condensedlines">
bla bla bla bla bla bla <br>
bla bla bla bla bla bla <br>
bla bla bla bla bla bla <br>
</p>
line-height
미세한 줄 간격 제어를 위해 늘릴 수도 있습니다 .
.mylinespacing {
font-size: 10pt;
line-height: 14pt; /* 14 = 10 + 2 above + 2 below */
}
<p>
블록 간 간격 인 줄 높이를 사용하여 CSS에서 단락 간 간격을 설정할 수 없습니다 . 대신 단락 내 줄 간격, <p>
블록 내 줄 사이의 간격을 설정합니다 . 즉, 선 높이는 단락 내에서 타이포 그래퍼의 선간 행간이 선 높이로 제어됩니다.
나는 현재 <p>
글꼴 속성에 em 또는 rem 변형을 사용하는지 여부에 관계없이 CSS에서 0.15em 간격 을 생성하는 방법을 알지 못합니다 . 더 복잡한 플로트 또는 오프셋으로 수행 할 수 있다고 생각합니다. 이것은 CSS에서 필요합니다.
이 속성을 사용해보십시오
line-height:200%;
또는
line-height:17px;
볼륨을 높이고 줄이십시오.
이것이 당신이 의미하는 바인지 확실하지 않습니다.
line-height: size;
line-height
재산을 보십시오 ; 선 높이를 지정하는 방법에는 여러 가지가 있습니다
lineSpacing은 React Native (또는 기본 모바일 앱)에서 사용됩니다.
웹의 경우 letterSpacing
(또는 letter-spacing
)
모두가 말한 것처럼 그렇습니다 line-height
. 높이 중간 문자 (예 : a 또는 ■, 위 또는 아래를 거치지 않음)를 사용하는 모든 글꼴의 높이 길이는에서와 같아야 line-height: 0.6
합니다 0.65
.
<div style="line-height: 0.65; font-family: 'Fira Code', monospace, sans-serif">
aaaaa<br>
aaaaa<br>
aaaaa<br>
aaaaa<br>
aaaaa
</div>
<br>
<br>
<div style="line-height: 0.6; font-family: 'Fira Code', monospace, sans-serif">
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■<br>
■■■■■■■■■■
</div>
<br>
<br>
<strong>BUT</strong>
<br>
<br>
<div style="line-height: 0.65; font-family: 'Fira Code', monospace, sans-serif">
ddd<br>
ƒƒƒ<br>
ggg
</div>
참고 URL : https://stackoverflow.com/questions/3845433/set-line-spacing
'IT박스' 카테고리의 다른 글
C ++에서 객체 유형 찾기 (0) | 2020.06.29 |
---|---|
Gradle : 태스크 ': processDebugManifest'에 대한 실행 실패 (0) | 2020.06.29 |
Facebook 앱의 Oauth Redirect URI는 어디에 설정합니까? (0) | 2020.06.29 |
구성 : 오류 : C 컴파일러가 실행 파일을 만들 수 없습니다 (0) | 2020.06.29 |
NSString에서 모든 공백 제거 (0) | 2020.06.29 |