Editare codice Html sulla pagina come testo

Corso online Responsive Design
Realizzare siti responsivi con HTML5 e CSS3.

Scritto da Luca Ruggiero nella sezione Html

Un classico problema che affrontano coloro che desiderano editare codice sorgente su di una pagina al fine di pubblicarla come materiale didattico, è quello di evitare che il browser lo interpreti come codice e lo esegua, invece che stamparlo a video, pronto per essere semplicemente letto.

I Tag Html sono racchiusi tra i caratteri < e >, quindi il browser interpreterà come codice <img src="immagine.jpg"> e tenterà di inserire un'immagine.

Per stampare a video il codice e non eseguirlo, si utilizzano una serie di caratteri speciali formati da simboli, numeri e lettere, ad esempio, il carattere < si può stampare a video con la combinazione &lt;, mentre l carattere > utilizza la combinazione &gt;.

Dunque, per scrivere <html> dovremo scrivere &lt;html&gt;.

Per scrivere un lungo codice, che si tratti di Html o di un linguaggio di scripting, si utilizza del Tag <pre> e </pre>, ovvero "testo preformattato" che non necessita di giustificazioni particolari del testo per stamparlo a video in un certo modo.

Per fornire un esempio completo, espongo il codice di un semplice Javascript che invento al momento:

<pre>
&lt;script language="javascript"&gt;
 &lt;!--
  function Esempio() {
    document.write("Codice di esempio");
    alert("Codice di esempio");
  }
 --&gt;
&lt;/script&gt;
</pre>
Questo è il risultato:
<script language="javascript">
 <!--
  function Esempio() {
    document.write("Codice di esempio");
    alert("Codice di esempio");
  }
 -->
</script>

I più cliccati della sezione Html

:: Impedire ad un testo di andare a capo in Html (34.443)

:: Le tabelle Html (31.276)

:: Formattazione del testo in Html (25.434)

:: Referenze dei Tag Html (19.109)

:: Creare tabelle con i bordi curvi (18.007)

:: Guida XHTML (16.408)

:: Struttura di un file Html (15.041)

:: Inserire un'icona nella barra degli indirizzi di MSIE (13.687)

:: Inserire le immagini in una pagina Html (11.123)

:: Sovrapporre un'immagine ad un layer senza posizionamento assoluto (10.960)

IN EVIDENZA
DOWNLOAD