글꼴·크기·줄간격

선택한 글자의 글꼴과 크기, 문단의 줄간격을 바꿉니다. 메뉴에 나오는 목록은 옵션으로 사이트에 맞게 바꿀 수 있습니다.

createEditor('#editor', {
  toolbar: 'fontFamily fontSize lineHeight | bold',
  fontSizes: [10, 12, 14, 18, 24],
  fontSizeUnit: 'pt',
});

글꼴 (fontFamily)

기본 목록은 Pretendard, 맑은 고딕, 나눔고딕, 나눔명조, 굴림, 돋움, 바탕, 궁서, Arial, Georgia, Times New Roman, Courier New 입니다. 맨 위 "기본 글꼴"을 고르면 글꼴 지정을 지웁니다.

fontFamilies 의 각 항목은 '메뉴 이름=CSS font-family 값' 형식입니다. = 가 없으면 첫 글꼴 이름이 메뉴 이름이 됩니다.

createEditor('#editor', {
  fontFamilies: [
    '본고딕=Noto Sans KR, sans-serif',
    '나눔스퀘어=NanumSquare, sans-serif',
    'Georgia, serif', // 메뉴에는 "Georgia"
  ],
});

글자 크기 (fontSize)

기본 목록은 8, 9, 10, 11, 12, 14, 16, 18, 20, 24, 28, 36 이고 단위는 pt 입니다. 한글 문서에 익숙한 사용자를 위해 pt가 기본이며, fontSizeUnit: 'px' 로 바꿀 수 있습니다. 크기를 지정하지 않은 곳에서는 메뉴 칸에 지금 보이는 크기가 단위에 맞춰 나옵니다.

줄간격 (lineHeight)

줄간격은 글자가 아니라 문단 단위로 들어갑니다. 기본 목록은 100, 130, 150, 160, 180, 200, 250 (%) 이고, "기본"을 고르면 지정을 지웁니다.

선택 없이 고르면

글자를 선택하지 않고 글꼴이나 크기를 고르면 그다음에 치는 글자에 적용됩니다.

프리셋

• board(기본): fontSize 는 첫 줄, fontFamily 와 lineHeight 는 ⋯ 더 보기 안
• full: 세 가지 모두 첫 줄
• basic, minimal: 없음

저장되는 HTML

<p style="line-height: 180%">
  <span style="font-size: 18pt">18pt 글자</span>
  <span style="font-family: NanumMyeongjo, 나눔명조, serif">나눔명조 글자</span>
</p>

편집 영역의 기본 글꼴과 크기를 보기 화면에 맞추려면 contentStyle 을 쓰세요 (편집 영역 스타일).

API

editor.exec('fontSize', '14pt');
editor.exec('fontFamily', 'Georgia, serif');
editor.exec('lineHeight', '160%');
editor.exec('fontSize', ''); // 지정 지우기

옵션