HTML Preview
Preview HTML code
Preview HTML code Запускается локально в вашем браузере
About the
Предварительный просмотр HTML отображает фрагмент HTML в реальном времени, поэтому вы можете увидеть, что он создает, не сохраняя файл и не открывая его. Он предназначен для коротких фрагментов: шаблона электронной почты, разметки компонента, фрагмента из системы управления контентом или чего-либо еще, на что вы хотите обратить внимание, прежде чем вставлять его куда-либо. Переключение между редактированием и предварительным просмотром происходит мгновенно, что упрощает настройку разметки.
Where people use the
- Проверка фрагмента шаблона письма перед отправкой теста.
- Предварительный просмотр разметки, вставленной из системы управления контентом.
- Проверка работоспособности фрагмента перед вставкой его в запрос на включение.
- Проверка того, отображается ли таблица или список ожидаемым образом.
How to use the
- 1
Вставьте свою разметку
Введите или вставьте фрагмент HTML в редактор. И полный документ, и его фрагмент работают.
- 2
Переключиться на предварительный просмотр
Нажмите «Предварительный просмотр», чтобы отрендерить его. Разметка отображается на странице так, как она отображается в браузере.
- 3
Переключитесь обратно и отрегулируйте
Нажмите «Изменить», чтобы вернуться к разметке. Изменения сохраняются, поэтому вы можете повторять их.
- 4
Скопируйте это, когда будете счастливы
Выберите разметку в редакторе и скопируйте ее в свой проект.
Советы и лучшие практики
- Добавьте встроенные стили, если ваш фрагмент зависит от таблицы стилей, которой здесь нет.
- Чистый рендеринг не является доказательством правильности разметки; браузеры скрывают ошибки.
- Помните о предварительном просмотре фрагментов, а не целых страниц с поведением скрипта.
Часто задаваемые вопросы
Поддерживает ли он CSS и JavaScript?
Теги стилей и встроенные стили визуализируются. Скрипты отображаются как разметка, но это предварительный просмотр фрагмента, поэтому поведение скрипта следует рассматривать как ненадежное.
Почему мой фрагмент отличается от моего сайта?
Потому что окружающая таблица стилей отсутствует. Фрагмент здесь ничего не наследует, поэтому все, что зависит от CSS вашего сайта, будет выглядеть неоформленным.
Могу ли я загрузить внешние изображения или шрифты?
Да, если они общедоступны, хотя собственные правила окружающей страницы по-прежнему не применяются.
Разметка загружена?
Нет. Рендеринг происходит в вашем браузере, поэтому неопубликованные шаблоны и внутренний контент остаются на вашем устройстве.
Проверяет ли он HTML?
Нет. Он отображает то, что вы ему даете. Браузер автоматически исправляет некоторые ошибки, поэтому чистый рендеринг не доказывает правильность разметки.