Атрибут contenteditable тега <ruby>

Описание

Атрибут contenteditable позволяет сделать содержимое элемента <ruby> редактируемым прямо в браузере. Это полезно для создания интерактивных учебных материалов по изучению иероглифов.

Пример использования:
<ruby contenteditable="true"> 漢 <rp>(</rp><rt>かん</rt><rp>)</rp> </ruby>

Значения атрибута:

Значение Описание
true Элемент редактируемый
false Элемент не редактируемый (по умолчанию)
inherit Наследует поведение от родителя

Особенности редактирования ruby-разметки:

  • Позволяет изменять как основной текст, так и ruby-аннотацию
  • Сохранение структуры ruby при редактировании зависит от браузера
  • Для сложных редакторов может потребоваться JavaScript

Пример с редактируемым учебным материалом:

<div class="study-card"> <ruby contenteditable="true"> 学 <rp>(</rp><rt contenteditable="true">がく</rt><rp>)</rp> </ruby> <p contenteditable="true">Пример использования: 学生（がくせい） - студент</p> </div>

Рекомендации по использованию:

  • Используйте для интерактивных упражнений по изучению языков
  • Сочетайте с CSS-стилями для визуального выделения редактируемых областей
  • Для сохранения изменений потребуется дополнительный JavaScript
  • Учитывайте различия в поведении между браузерами

Ограничения:

  • Структура ruby может нарушаться при редактировании
  • Ограниченный контроль над процессом редактирования
  • Не поддерживает сложное форматирование при редактировании
  • Изменения не сохраняются автоматически