Três maneiras de exibir HTML de exemplo em um Web Browser

If você estiver olhando para escrever sobre web design e HTML, você não tem nenhuma dúvida executar para esse problema. Como você exibir amostra de mark-up que o usuário pode ver? O problema é simples. Você deseja exibir a marcação da amostra. O navegador utilizadores quer para torná-lo tão real mark-up. Você precisa vir com algo para dizer ao navegador - Ei, isso não é suposto ser processado Existem algumas maneiras de fazer this.First, você poderia usar um tag xmp tag.The xmp foi desenvolvido para a exibição de "exemplo" HTML! .

Uma vez que o navegador vê uma marca xmp, ele pára de render tudo HTML até que vê um tag.However fechamento, o tag está obsoleto. Já não está incluído nos padrões HTML - que impeçam o seu site de validação - e ele pode não ser suportado por todos os browsers. Use a seu próprio risk.A segundo, método mais confiável, é incluir a marcação em um textarea box.When você criar um elemento textarea, você pode incluir texto entre a abertura e marcas de fechamento como texto "default". Qualquer HTML neste texto permanece unrendered - que permite que você exiba facilmente sua amostra markup.

There dois problemas com isso, porém. Primeiro, você não pode incluir uma tag textarea fechamento dentro do seu exemplo -, ou ele vai prematuramente fechar o textarea que você está usando para exibir o seu exemplo. Você também não pode estilizar o texto em tudo com css.The terceira solução - provavelmente o melhor - é escapar todo o & lt; e & gt; sinais da amostra code.If você substitui & lt; com & amp; lt ;, o navegador não vai pensar que a marca é html real. Ele simplesmente irá exibir o markup.

This é de longe o método mais seguro de exibir seu HTML de exemplo, o único problema é que você precisa escapar de todos os personagens. No entanto, você pode tomar um shorcut - use este formulário para fazer a escapar para you.Copy e cole o seu próprio código, e escapou o código será criado no local

.