>  기사  >  웹 프론트엔드  >  CSS 줄 높이 계산

CSS 줄 높이 계산

高洛峰
高洛峰원래의
2017-02-09 16:47:251652검색

line-height는 두 줄의 텍스트 기준선 사이의 거리인 줄 높이를 나타냅니다.

라인 상자 상자-> 인라인 상자(인라인 요소) -> 익명 인라인 상자(콘텐츠 영역/텍스트/인라인 상자), 순서대로 포함, 한 줄에 한 줄 상자, 여러 줄에 여러 줄 라인박스가 쌓입니다.

CSS 줄 높이 계산

줄 간격은 첫 번째 텍스트 줄의 아래쪽 줄부터 두 번째 텍스트 줄의 위쪽 줄까지의 두 텍스트 줄 사이의 거리입니다.

줄 간격은 줄 간격의 절반입니다.

줄 높이 = 내용 영역 + 줄 간격, (일부 글꼴의 경우 심선송과 같이 내용 영역 높이가 글꼴 크기와 동일함)

CSS 줄 높이 계산

1. 블록 수준 요소의 높이와 글꼴 크기는 관계가 없습니다.

CSS 줄 높이 계산

CSS 줄 높이 계산

CSS 줄 높이 계산

2. 인라인 요소의 높이는 글꼴 크기에 따라 지원되며, 설정된 줄 높이는 지원됩니다. 요소 높이에 영향을 주지 않음

CSS 줄 높이 계산

CSS 줄 높이 계산

CSS 줄 높이 계산

CSS 줄 높이 계산

3줄 또는 2줄의 텍스트는 줄 높이를 설정합니다. 값이 작을수록 콘텐츠 영역의 크기는 변하지 않고 줄 간격이 작아지며, 최소 줄 높이는 0이 됩니다. 그 반대의 경우도 마찬가지입니다.

CSS 줄 높이 계산

CSS 줄 높이 계산

4. 블록 수준 컨테이너에서 인라인 요소를 세로로 가운데 정렬하는 원칙(실제로는 가운데에 있는 것이 아니라 가운데에 있는 것처럼 보임)은 다음과 같습니다.

행 높이를 설정할 때 콘텐츠의 높이 영역은 변경되지 않고 유지됩니다(일반적으로 글꼴 크기 및 글꼴 모음에 따라 결정됨). 콘텐츠 영역의 위쪽 및 아래쪽으로 반줄 간격이 증가/감소합니다(음수 반줄 간격)

CSS 줄 높이 계산CSS 줄 높이 계산

CSS 줄 높이 계산                                                                              ~                                              🎜> CSS 줄 높이 계산

Css 줄 높이 계산과 관련된 더 많은 기사를 보려면 PHP 중국어 웹사이트를 주목하세요!

성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.
이전 기사:CSS 단위 요약다음 기사:CSS 단위 요약