HTML Computer Code Elements
Computer Code
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
HTML Computer Code Formatting
Normally, HTML uses variable letter size, and variable letter spacing.
This is not wanted when displaying examples of computer code.
The <kbd>, <samp>, and <code> elements all support fixed letter size and spacing.
HTML Keyboard Formatting
The HTML <kbd> element defines keyboard input:
HTML Sample Formatting
The HTML <samp> element defines a computer output:
Example
<samp>
demo.example.com login: Apr 12 09:10:17
Linux 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189
</samp>
demo.example.com login: Apr 12 09:10:17
Linux 2.6.10-grsec+gg3+e+fhs6b+nfs+gr0501+++p3+c4a+gr2b-reslog-v6.189
</samp>
Try it Yourself »
HTML Code Formatting
The HTML <code> element defines programming code:
Example
<code>
var person = { firstName:"John", lastName:"Doe", age:50, eyeColor:"blue" }
</code>
var person = { firstName:"John", lastName:"Doe", age:50, eyeColor:"blue" }
</code>
Try it Yourself »
The <code> element does not preserve extra whitespace and line-breaks:
Example
<p>Coding Example:</p>
<code>
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
</code>
<code>
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
</code>
Try it Yourself »
To fix this, you must wrap the code in a <pre> element:
Example
<p>Coding Example:</p>
<code>
<pre>
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
</pre>
</code>
<code>
<pre>
var person = {
firstName:"John",
lastName:"Doe",
age:50,
eyeColor:"blue"
}
</pre>
</code>
Try it Yourself »
HTML Variable Formatting
The HTML <var> element defines a mathematical variable:
HTML Computer Code Elements
| Tag | Description |
|---|---|
| <code> | Defines programming code |
| <kbd> | Defines keyboard input |
| <samp> | Defines computer output |
| <var> | Defines a mathematical variable |
| <pre> | Defines preformatted text |
SHARE THIS PAGE
W3Schools is optimized for learning, testing, and training. Examples might be simplified to improve reading and basic understanding. Tutorials, references, and examples are constantly reviewed to avoid errors, but we cannot warrant full correctness of all content. While using this site, you agree to have read and accepted our terms of use,cookie and privacy policy. Copyright 1999-2015 by Refsnes Data. All Rights Reserved.
No comments:
Post a Comment