How do you display raw source code on a webpage?

22.April, 2010

I want to put some example pieces of code on a webpage. What’s the best way to do this?

Code inside a text box:

Use either a div container styled for the width height you need or use the textarea tags:

<textarea style="background: transparent none repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial;" rows="8" cols="70"></textarea>

The important thing is to de-activate all HTML code you want to put inside your text box. This is done by converting the HTML to text using the character entity code for the "<" symbol.

& lt ; (without spaces) = <

Then all HTML code inside your box should look something like this:

& lt ;img style="width: XXpx; height: 0; border: 0;" src="" alt=""> or
& lt ;a href="" title=""> Link Text & lt;/a>

Remember, this code is shown with spaces so YA doesn’t convert it.

Ron

Geschrieben von: admin Zufinden in: webpage

3 Meinungen für “How do you display raw source code on a webpage?”

  1. cheryl sagt:
    22.April, 2010 um 11:01 am

    kjbkje
    References :

  2. sajan sagt:
    22.April, 2010 um 11:37 am

    You can use Try it yourself editor. Which will let the user edit the code and also see the result of the changes made. A similar script has been used in sites like http://www.3schools.com. in which often the HTML codes are explained in detail.

    hope that answers your question. Good Luck
    References :
    http://www.onlinetutorials4free.com

  3. ✞☠ Mr. Roach ☠✞ sagt:
    22.April, 2010 um 12:10 pm

    Code inside a text box:

    Use either a div container styled for the width height you need or use the textarea tags:

    <textarea style="background: transparent none repeat scroll 0% 50%; -moz-background-clip: initial; -moz-background-origin: initial; -moz-background-inline-policy: initial;" rows="8" cols="70"></textarea>

    The important thing is to de-activate all HTML code you want to put inside your text box. This is done by converting the HTML to text using the character entity code for the "<" symbol.

    & lt ; (without spaces) = <

    Then all HTML code inside your box should look something like this:

    & lt ;img style="width: XXpx; height: 0; border: 0;" src="" alt=""> or
    & lt ;a href="" title=""> Link Text & lt;/a>

    Remember, this code is shown with spaces so YA doesn’t convert it.

    Ron
    References :

Hinerlasse Deine Meinung