contenteditable 속성

contenteditable 속성을 사용하면 브라우저를 통해 페이지의 모든 요소를 편집 가능하게 만들 수 있습니다.

값 true는 편집을 활성화하고, false는 비활성화합니다. true 대신 빈 값을 지정하거나 아예 쓰지 않을 수도 있습니다.

편집 후에 변경 사항이 어딘가에 저장될 것이라고 생각해서는 안 됩니다. 이는 JavaScript를 통해 직접 구현해야 합니다.

예제

브라우저를 통해 문단 텍스트를 편집해 봅시다 (그냥 마우스로 클릭하고 쓰기 시작하면 됩니다):

html<p contenteditable>
  이 문단의 텍스트는 브라우저를 통해
  편집할 수 있습니다.
</p>

Результат:

예제

이제 텍스트 편집을 비활성화해 봅시다 (이를 위해 contenteditable 속성을 아예 쓰지 않을 수도 있습니다):

html<p contenteditable="false">
  이 문단의 텍스트는 브라우저를 통해
  편집할 수 없습니다.
</p>

Результат:

함께 보기

  • textarea 태그,
    텍스트 편집기를 만드는 데 사용할 수 있음