Как отобразить код HTML код в Pre или что-то вроде этого, но не избежать его

Вы можете использовать хмр элемента, см. https://stackoverflow.com/questions/4545/what-was-the-xmp-tag-used-for. Он был в HTML с самого начала и поддерживается всеми браузерами. Технические характеристики хмуриться на него, но и HTML5 CR по-прежнему описывает его и требует браузерах, чтобы поддержать его (Хотя он также говорит авторам не использовать его, но это не помешает вам).

Все внутри бесшумной берется как таковой, нет разметки (теги или ссылки на символы) есть признал, кроме того, для сего, конечным тегом элемента, в </хмр>.

В противном случае хмр отображается как до.

При использовании “реального xHTML-код”, т. е. с XHTML подается с типом XML СМИ (что бывает редко), специальные правила анализа не применяются, так бесшумной трактуется как до. Но в “реальном формате XHTML”, вы можете использовать раздел CDATA, что предполагает аналогичные правила разбора. Она не имеет никакое специальное форматирование, так что вы, вероятно, хотите, чтобы обернуть его внутри пред элемент:

<pre> will
appear literally.
]]></pre>

Я не понимаю, как вы могли бы объединить раздел хмр `CDATA и достичь так называемой полиглот разметки

в По существу изначального вопроса может быть разбита на 2 части:

• Основная цель/задача: внедрение(/перевозки) сырое отформатированный код-сниппет (любой код) в веб-страницы'ы разметки (для простой копировать/вставить/редактировать из-за отсутствия кодирование/побега)
• правильно отображения/рендеринга, что код-сниппет (возможно редактировать) в браузер Короткий (а) двусмысленным ответ: вы можете'т, ...но вы можете (очень близко). (Я знаю, что 3 прямо противоположные ответы, так что читайте дальше...) (полиглот)(х), (ХТ)мл разметки-языки используют для упаковки (почти) все, что между началом/открытия и закрытия тегов/символов(последовательностей). Так, для размещения любой вид сырья код/фрагмент внутри вашей разметке-языке, всегда придется бежать/кодировать каждый экземпляр (внутри фрагмента), что напоминает персонаж (последовательности), что бы закрыть упаковку 'контейнер' элемент в разметке. (В этом посте я'МР относятся к этому как правило 1.) Думаю, в "какая-то "Сведения" не здесь" или<и>..закрыть курсивом с &#39;</а>&#39;-тег</я и GT;, когда очевидно, следует защитить/зашифровать (что-то) в </i и в " (или менять контейнер'с цитатой-персонаж в " на '). Так, потому что правила нет 1, Вы можете'т 'просто' размещения 'все' неизвестный исходный код-фрагмент внутри разметки. Потому что, если есть возможность избежать/кодирование еще один символ внутри сырое фрагмент, то фрагмент будет не будет таким, как оригинал 'чистый исходный код' что кто-то может копировать/вставить/редактировать в документе'ы разметки не задумываясь. Это приведет к искаженной/незаконной разметки и Mojibake (в основном) из-за сущности. Кроме того, если что фрагмент содержит такие символы, то вы'д еще нужны некоторые JavaScript 'перевести' Этот символ(последовательность) от (и до) это'ы сбежал/закодированное представление, чтобы отобразить фрагмент правильно в 'веб-страницы' (для копии/вставки/редактирования). Это подводит нас к (Некоторые), которые разметки-языки указать. Эти типы, по сути, определение того, что считается 'допустимые символы' и их значение (на каждый тег, собственность и т. д.):
• PCDATA (разобранные символьные данные): будем расширять лиц и надобно побег в <, & (и в > в зависимости от языка разметки/версия). Большинство тегов, как тело, див, до, и т. д., а также текстовое поле (пока В HTML5) подпадают под этот тип. Так что не только вы должны кодировать все контейнера's закрытие персонаж-последовательностей внутри фрагмента, вы также должны кодировать все в <, & (, в>) символов (как минимум). Излишне говорить, что кодирование и избавление многих персонажей находится вне этого цель's в рамках внедрения необработанный фрагмент в разметке. '.., но это, кажется, работает...', да, либо из-за браузеров ошибка-двигатель пытается сделать что-то из этого, или потому, что в HTML5:
• RCDATA (сведения сменный характер): не не лечить теги внутри текст разметки (но по-прежнему регламентируются правилом 1), так что никто не'т нужно кодирование в < (в>). Но лица по-прежнему расширяется, поэтому они и 'неоднозначно амперсанды' (&) нуждаются в особом уходе. В текущем спецификации HTML5 говорит textarea-это теперь поле RCDATA и (цитата):

  текст в элементы исходного текста " и " RCDATA**не должны** содержит каких-либо вхождения строки в"</"` В (от U+003C знак "меньше", у+002Ф Солидус) после символов, без учета регистра матч бейджик элемент, за которым следует один из U+0009 знак табуляции (клавиша Tab), у+000А строки (LF), от U+000С формы (ФФ), от U+000D возврат каретки (ЧР), от U+0020 пространства, от U+003e звено символ "больше" (>), или U+002Ф Солидус (/). Таким образом, несмотря ни на что, это нуждается в здоровенный сущности обработчик перевода или это будет в итоге Mojibake на лиц!

• (Данные о характере использования CDATA) **не будем рассматривать теги внутри текста разметки и не раскрывают сущности**. Так что, пока сырой фрагмент кода не нарушать правило 1 (что можно'т есть контейнеры закрывающий символ(последовательность) внутри фрагмента), это требуется *нет прочее* экранирование/кодирования. Ясно *это сводится к тому: как мы можем **свернуть** количество знаков/символов-последовательности, которые еще должны быть закодированы в сниппете'ы исходник* и сколько раз этот символ(последовательность) может появиться в среднем фрагмент; то, что также имеет значение для JavaScript, который обрабатывает перевод этих символов (если они происходят). Так что 'контейнеров' иметь контекст этого типа CDATA? Большинство свойств значение тегов типа CDATA, так один может (АБ)использовать скрытые поля ввода'собственность с значением ([доказательство концепции jsfiddle здесь][3]). Тем не менее (соответствуют правилу 1) это создает кодирование и избежать проблем со вложенными цитатами (в" и ') в исходном фрагменте, и нужно немного JavaScript, чтобы получить/перевести и установить в другом фрагменте (видимый) элемент (или просто установить его в качестве текста-уголок's стоимостью). Как-то у меня проблемы с лицами в ФФ (как в текстовой области). Но это вовсе'т действительно важно, так как 'Цена' придется бежать/кодирование вложенные цитаты выше, чем (в HTML5) текста (цитаты, довольно часто встречаются в исходном коде..). А как насчет попыток (Ab)использовать <![Тип CDATA [в<тег>бла & бла</тег>]]> У? Как юкка указывает в своем развернутый ответ, это будет работать только в (редких) 'капиталовложения в XHTML'. Я думал использовать скрипт-тег (С или без такого использования CDATA обертка, внутри скрипт-тег) вместе с многострочный комментарий/ /что обертывания необработанный фрагмент (скрипт-теги могут иметь идентификатор и вы можете открыть их по числу). Но так как это очевидно, представляет спасаясь проблема с/,]]>и</скрипт` в необработанном фрагменте, это не'т похоже на выход. Пожалуйста, напишите другие жизнеспособные 'контейнеров' в комментариях к этому ответу. Кстати, кодирования и подсчета количества - символы и балансируя их в тег комментария в <!-- --> это просто безумие для этих целей (кроме нормы 1). <ч> Что оставляет нас с Юкка корпела К.'с выбором ответа: в в `<хмр и GT; тег, кажется, самый лучший вариант! В 'забыл' в <бесшумной> держит `типа CDATA, предназначен для этой цели и по-прежнему [в текущем* и HTML 5 спецификации]5 (и уже как минимум с HTML3.2); то, что нам нужно! Это's также широко поддерживается, даже в IE6 (то есть.. пока она страдает от той же регрессии в качестве стола-тело прокрутка). Примечание: как юкка указал, это не будет работать на истинный XHTML или полиглот (что будет относиться к ней как к пред) и `хмр тег по-прежнему должны придерживаться правила не 1. Но, что'ы 'и#39; правила. Рассмотрим следующую разметку:

<div>
    <div>this is an example div & holds an xmp tag:<br />


    My Title

    <p>hello world !!</p>

        </xmp>  
    </div>
    This line is also part of the snippet
</div>

Выше codeblok иллюстрирует сырой кусок разметки, где в <хмр идентификатор="и фрагмент-контейнер" и> содержит (почти сырые) код-фрагмент (содержащий див>див>в XMP>HTML-документ). Обратите внимание на закрывающий тег, закодированных в этой разметке? В соответствии с правилом № 1, в этом был закодирован/убежал). Поэтому встраивания/транспортировки (иногда почти) сырой код/кажется, решена. Насчет отображения/визуализации фрагмента (а что, закодированных &ЛТ;/хмр>)? Браузер (или он должен) представить фрагмент (содержание внутри фрагмента-контейнера) *именно* то, как вы видите его в блок кода выше (с некоторым несоответствием между браузерами ли фрагмент начинается с пустой строки). Что *включает* форматирование/отступы лиц (как строку&амп;), полностью Теги, комментарии *и закодированных закрывающим тегом&ЛТ;/хмр>(как это было закодировано в разметке)*. И в зависимости от браузера(версия) можно даже попробовать использовать свойство contenteditable=то"Правда" в отредактировать этот фрагмент (все, что без JavaScript). Делать что-то вроде текстовое поле.значение=хмр.innerHTML будет также ветер. **Так что вы можете**... ** если фрагмент не'т содержать контейнеры закрывающий символ последовательности. *** Однако*, *должны* необработанный фрагмент содержит закрывающий символ-последовательность в</хмр (потому что это пример XMP на себя или он содержит некоторые выражения, и т. д.), Вы должны признать, что у вас есть для кодирования/побег той последовательности, в сырой фрагмент и нужен яваскрипт обработчик перевести эту кодировку для отображения/вывода закодированных&ЛТ;/хмр>как в</хмр>внутритекстовое поле(для редактирования/проводки) или (к примеру)предпросто, чтобы правильно представить фрагмент's код (или так кажется). Очень рудиментарные [jsfiddle пример здесь][6]. Отметим, что получение и внедрение/отображение/извлечение в текстовое поле работала идеально, даже в IE6. Но настройки в XMP'innerHTML будет s `были выявлены некоторые интересные 'бы-бы-умный' поведение и т. д. Это's частью. Есть более широкое внимание, и решение о том, что в скрипке. Но сейчас идет важно Кикер (еще одна причина, почему вы получаете только очень близко): Просто как упрощенный пример, представьте этот кроличья нора: Предназначен сырой код-сниппет:

<p>a paragraph</p>

Ну, в соответствии с правилом 1, мы 'только' нужно, чтобы закодировать эти в </хмр[> \н\р\т\е\/] последовательностей, верно? Итак, что дает нам следующую разметку (используя только возможности кодирования):

<p>a paragraph</p>
</xmp>

Мда.. будешь мне получить мой хрустальный шар или монетку? Нет, пусть компьютер посмотреть его система-часы и заявить, что производная числа 'случайных'. Да, это должно сработать.. С использованием regex как: хмр.innerHTML будет.заменить(/&ЛТ;(?=\/хмр[> \н\р\т\е\/])/ги, &#39;<&#39;);, перевел бы 'обратно' чтобы этого:

<p>a paragraph</p>

Хм.. кажется, это случайный генератор сломан... Хьюстон..? Если вы пропустили шутка/проблема, прочитайте еще раз начиная с 'предназначен сырой код-сниппет'. Подожди, я знаю, мы (также) нужно кодировать .... в .... ОК, перемотка назад 'предназначен сырой код-сниппет' и снова читать. Как-то это все начинает пахнуть знаменитый веселый-но-правда rexgex-ответа на так, хорошее чтение для людей, свободно владеющих mojibake. Может кто-то знает хитрый алгоритм или решение, чтобы исправить эту проблему, но я предполагаю, что встроенный RAW код будет становиться все более и более неясными до точки, где вы'd быть лучше правильное экранирование/кодирование просто вашей в <, & (и в >), как и весь остальной мир. Вывод: (через хмр тег)

• это можно сделать с известных фрагментов, которые не содержат контейнер's закрытие персонаж-последовательности,
• мы можем подойти очень близко к первоначальной цели с известными фрагментами, которые используют только 'базовый уровень' побега/кодирование, поэтому мы не'т упасть в кроличья нора,
• но в конечном счете кажется, что можно'т сделать это надежно в 'производство-окружающая среда', где люди могут/должны копировать/вставить/редактировать 'неизвестные' сырые фрагменты, при этом не зная/понимая последствия/правила/кроличья нора (в зависимости от реализации обработка/перевод правила 1 и кроличья нора).

Надеюсь, что это помогает! ПС: А я бы очень забавным, если вы найдете это объяснение полезно, я думаю, что Юкка'ы ответ должно быть принято отвечать (если не лучший вариант/ответ приходят вместе), так как он был единственным, кто вспомнил хмр метку (что я забыла о годами и у 'отвлекаться' С широко пропагандируется PCDATA элементы, такие как пред, текстовое поле, и т. д.). Этот ответ возник в объяснения, почему вы можете'т сделать это (с какого-то неизвестного сырья фрагмент) и объяснить некоторые очевидные подводные камни, которые некоторые другие (сейчас удален) ответ упускается из виду при консультировании компонент textarea для встраивания/транспорта. Я'ве расширил существующие объяснения и поддержку и разъяснить Юкка'ы ответ (поскольку все, что лицо и *разделов CDATA вещи почти сложнее, чем код-страницы).

Дешево и сердито ответил:

<textarea>Some raw content

echo '<pre>' . htmlspecialchars("<div>raw HTML</div>") . '</pre>';

Я думаю, что's то, что вы'вновь искать?

Другими словами, использовать функции htmlspecialchars() в PHP

@GitaarLAB и @Юкка уточнил, что в `<хмр и GT; тег является устаревшим, но все-таки лучше. Когда я использую его, как это

<div>Lorem ipsum</div>
<p>Hello</p>

тогда первый Эол вставляется в код, и это [выглядит ужасно](http://jsfiddle.net/u62jcoL8/).

Она может быть решена путем удаления, что Эол

<div>Lorem ipsum</div>
<p>Hello</p>

но тогда она плохо выглядит в источнике. Я привык решать с помощью оберточной <див>, но недавно я нашел хорошее правило CSS3, и я надеюсь, что это помогает кто-то:

xmp { margin: 5px 0; padding: 0 5px 5px 5px; background: #CCC; }
xmp:before { content: ""; display: block; height: 1em; margin: 0 -5px -2em -5px; }

Это [выглядит лучше](http://jsfiddle.net/u62jcoL8/1/).

`хмр-это путь, т. е.:

  # your code...

Если у вас включен jQuery вы можете использовать функцию escapeXml и не придется беспокоиться о побеге стрелки или специальные символы.

<pre>
  ${fn:escapeXml('

  ')};
</pre>