HTML "Computer Output" tab <code><kbd><samp><tt><var><pre>

Source: Internet
Author: User

We are not against using them, but if you are using them just to achieve a certain visual effect, we recommend that you use style sheets, which can be more productive.

<code> Tags-Define computer code text.

Definition and Usage:

<code> tags are used to indicate computer source code or text content that can be read by other machines.

Software code writers have become accustomed to the special style of text representation when writing source code. <code> tags are designed for them. The text contained within the label will be displayed with a wide, typewriter-like font (Courier), which should be familiar to most programmers and w3school users.

The <code> tag should be used only on text content that represents the source code of the computer program or that other machines can read. Although the <code> tag usually only turns text into equal-width fonts, it implies that the text is the source code. Future browsers may add additional display effects. For example, a programmer's browser might look for a <code> fragment and perform some extra text formatting, such as looping and conditional judgment statements for special indentation, and so on.

Hints and notes

Tip: If you just want to use the effect of the equal-width font, use the <tt> tab. Or, if you want to display programming code in text that is strictly restricted to equal-width font formatting, use the <pre> tag.

<kbd> 标签-定义键盘文本

Definition and Usage:

<kbd> tags define keyboard text.

When it comes to the special style of technical concepts, it is necessary to refer to <kbd> tags. As you have guessed, it is used to indicate that the text is typed from the keyboard.

The browser typically displays the text contained in the label in a width-equal font.

<kbd> tags are often used in computer-related documents and manuals.

<samp> tags-Define sample text.

Definition and Usage:

The <samp> tag represents a text character that a user should have no other explanation for. This tag is commonly used when extracting these characters from a normal context.

Take a look at the following example:

< Samp >ae</samp>&aelig; hyphenation characters.

The above HTML code will appear as:

The character sequence AE may be converted to an æ hyphen character.

Note: in HTML, the special entity used for "AE" ligatures is "&aelig;", and most browsers convert it to the corresponding "æ" hyphenation character.

<samp> tags are not often used. This tag is used only when you want to extract certain short character sequences from normal contexts and emphasize them in very few cases.

<tt> Label-Define the typewriter code.

Definition and Usage:

The <tt> label presents a text effect similar to a typewriter or equal width.

<tt> tags like <code> and <kbd> tags,<tt> tags and required </tt> end tags tell browsers to display the text they contain as equal-width fonts. For browsers that already use the same wide font, the label has no special effect on the text display.

<var> tags-define variables.

Definition and Usage:

The <var> tag represents the name of the variable, or the value provided by the user.

<var> tags are another trick to apply to computer documents, which are often used with <code> and <pre> tags to display examples of computer programming code and specific elements of similar aspects.

Text marked with <var> tags is usually displayed in italics.

Just like other labels related to computer programming and documentation,,<var> tags not only make it easier for users to understand and navigate your documents, but some automated systems can also use these appropriate tags to extract information from your documents and the useful parameters mentioned in the documentation. Once again, we emphasize that the more semantic information is provided to the browser, the better the browser can present the information to the user.

<pre> Tags-Define pre-formatted text.

Definition and Usage:

The pre element can define preformatted text. Text that is enclosed in the pre element usually retains spaces and line breaks. The text is also rendered as an equal-width font.

A common application of <pre> tags is to represent the source code of the computer.

Labels that can cause broken paragraphs, such as headings, <p> and <address> tags, must never be included in <pre> defined blocks. Although some browsers interpret the end-of-paragraph tag as simply wrapping, this behavior is not always the same on all browsers.

The text allowed in the pre element can include physical styles and content-based style changes, as well as links, images, and horizontal dividers. When you place other labels (such as <a> tags) in a <pre> block, it is as if you were in other parts of the html/xhtml document. Take a look at the following example:

<Pre>&lt;Html&gt;&lt;Head&gt;  &lt;Script Type=&quot;Text/javascript&quot;Src=&quot;Loadxmldoc.js&quot;&gt;&lt;/script&gt;&lt;/head&gt;&lt;Body&gt;  &lt;Script Type=&quot;Text/javascript&quot;&gt;xmldoc=<ahref= "Dom_loadxmldoc.asp">Loadxmldoc</a>(&quot;Books.xml&quot;); document.write (&quot;XmlDoc is loaded&quot;); &lt;/script&gt;&lt;/body&gt;&lt;/html&gt;</Pre>

In the above code, the special symbols in the,<pre> tag are converted to symbol entities, such as "&lt;" for "<", "&gt;" for ">". Also, note the blue code, which we used in the <pre> tag, which is the <a> tag. The above code shows the following results:

<HTML><Head>  <Scripttype= "Text/javascript"src= "Loadxmldoc.js"></Script></Head><Body>  <Scripttype= "Text/javascript">xmldoc=Loadxmldoc ("books.xml"); document.write ("xmldoc is loaded"); </Script></Body></HTML>

Hints and Notes

Tip: Tabs (tab) can play a role in the blocks defined by the <pre> tag, with each tab occupying a 8-character position. However, we do not recommend it because the TAB implementation differs in different browsers. Use spaces in a document segment formatted with <pre> labels to ensure that the text is in the correct horizontal position.

Tip: If you want to use <pre> tags to define computer source code, such as HTML source code, use symbolic entities to represent special characters, such as "&lt;" for "<", "&gt;" for ">", "&amp;" Represents "&".

Tip: In W3school, the source code instances in very many pages are defined by the <pre> tag, and you can refer to these pages to learn how to use the tag. We even combine <pre> tags with <code> tags to get more precise semantics.

HTML "Computer output" label <code><kbd><samp><tt><var><pre>

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.