Главная
HTML-тег <pre>
Характеристики
- Тип: блочный, статичный, семантический
- Назначение: Отображает текст с сохранением пробелов и переносов строк, обычно используется для отображения блоков кода.
- Родители: Любые элементы, допускающие потоковый контент.
- Потомки: Потоковый контент, часто сочетание текста и элементов <code>.
- Глобальные атрибуты: все
- Атрибуты событий: все
Пример использования
<pre>
function helloWorld() {
console.log('Hello, world!');
}
</pre>
Использование в JavaScript
// Прокрутка длинного блока кода
const preElement = document.querySelector('pre');
preElement.style.overflowX = 'auto';
Рекомендации по обеспечению доступности (a11y)
- Используйте для отображения блоков текста с сохранением форматирования.
- Убедитесь, что текст внутри <pre> читабелен и не выходит за пределы экрана.
- Комбинируйте с <code> для семантической разметки кода.
Полезные ссылки