Fandom

Avatar Wiki

Comment1

Pre tags and Syntaxhighlight tags

MateyY October 13, 2012 User blog:MateyY

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.

Here is a simple tutorial on how to use <pre> tags and <syntaxhighlight> tags. For any questions, feel free to contact me.

<pre> tags

<pre> tags are great to wrap coding samples without any syntax highlighting. They also preserve all spaces.

Here is a chunk of code wrapped and not wrapped in a <pre> tag:

<text> here is some text </text>

<text>   here is some text    </text>

To wrap code in <pre>tags, just write: <pre>your code</pre>

<syntaxhighlight> tags

The <syntaxhighlight> tags are used to highlight syntax on different script/programming/markup languages. The tag <source> is its alias, but is not recommended because of XML conflicts.

Here is the difference between a <pre> tag and a <syntaxhighlight> tag:

With a <pre>tag:

var callback = function() {
     for (var i = 0; i < this.childNodes.length; i++) this.removeChild(this.childNodes[i]);
},
    body = document.body;
if (body.addEventListener) body.addEventListener("click",callback,false);
else body.attachEvent("onclick",function() {
     callback.call(body);
});

With a <syntaxhighlight>tag:

var callback = function() {
     for (var i = 0; i < this.childNodes.length; i++) this.removeChild(this.childNodes[i]);
},
    body = document.body;
if (body.addEventListener) body.addEventListener("click",callback,false);
else body.attachEvent("onclick",function() {
     callback.call(body);
});

To use that tag, just write: <syntaxhighlight lang="language">your code</syntaxhighlight>

Some languages are: javascript, html5, and css. If the language is invalid, a box will show up with all the valid languages.

Also on Fandom

Random Wiki