리치 텍스트 컴포넌트

삽입

왼쪽 상단의 슬라이드 추가 버튼에서 텍스트를 삽입할 수 있습니다.

또는 선택한 컴포넌트의 상단/하단에 있는 플러스 아이콘을 사용하여 슬라이드 / 컨테이너 / 인라인 레벨에 추가할 수 있습니다.

DOM 구조

텍스트 컴포넌트는 HTML DOM 구조에서 다음과 같이 구성됩니다.

<div>
  <h1>...</h1>
  <h2>...</h2>
  <h3>...</h3>
  <p>...</p>
</div>

따라서 스타일을 설정할 때 루트 노드의 직접적인 자식을 대상으로 해야 합니다.

블록 수직 여백 설정

&>*.margin: 20px 0

블록 줄 높이 설정

&>*.lineHeight: 1.4

제목에만 스타일 설정하기

예제에서는 h1을 사용합니다. h2, h3, p 등을 지정할 수도 있습니다.

&>h1.fontSize: 3em;

SEO 고려사항

브라우저에서 기본 스타일을 가지는 것 외에도, 제목(h1 / h2 ...)은 검색 엔진에 대한 의미적 지표로 작용합니다. 검색 엔진은 제목을 분석하여 웹페이지의 내용을 이해합니다. 더 많은 정보를 얻으려면 seo headings를 검색해 보세요.