MediumEditor는 텍스트 에디터를 사용하기 위한 JavaScript 라이브러리입니다. 이 라이브러리를 사용하면 사용자가 간편하게 텍스트를 편집할 수 있습니다. 이번에는 MediumEditor에서 텍스트를 정렬하는 방법에 대해 알아보겠습니다.

MediumEditor 설치

먼저 MediumEditor를 설치해야 합니다. 아래 명령어를 사용하여 npm을 통해 MediumEditor를 설치할 수 있습니다.

npm install medium-editor

MediumEditor 초기화

MediumEditor를 사용하기 위해 HTML 파일에 다음 코드를 추가합니다.

<div id="editorElement" contenteditable></div>

그런 다음 JavaScript 파일에서 MediumEditor를 초기화합니다.

import MediumEditor from 'medium-editor';

const editorElement = document.getElementById('editorElement');
const editor = new MediumEditor(editorElement);

이제 기본적인 MediumEditor가 준비되었습니다.

텍스트 정렬하기

MediumEditor에서 텍스트를 정렬하려면 텍스트를 감싸고 있는 <p> 태그에 대해 CSS 속성을 조정해야 합니다. 아래와 같이 HTML 태그에 클래스를 추가합니다.

<div id="editorElement" contenteditable>
  <p class="text-left">Left aligned text</p>
  <p class="text-center">Center aligned text</p>
  <p class="text-right">Right aligned text</p>
</div>

그리고 CSS 파일에 다음 코드를 추가합니다.

.text-left {
  text-align: left;
}

.text-center {
  text-align: center;
}

.text-right {
  text-align: right;
}

이제 MediumEditor에서 텍스트가 정렬되었습니다.

추가 옵션

MediumEditor에서 텍스트 정렬에 대한 추가적인 옵션을 사용하고 싶다면 공식 문서를 참고하세요. 여기에는 텍스트 정렬을 비롯하여 다양한 기능과 옵션에 대한 자세한 설명이 있습니다.

이제 MediumEditor를 사용하여 텍스트를 쉽게 정렬할 수 있습니다. 다양한 기능들을 활용해 보세요!