Tutorials Point


  HTML Tutorial
  HTML References
  HTML Tools
  HTML Resources
  Selected Reading

Copyright © 2014 by tutorialspoint



  Home     References     Discussion Forums     About TP  

HTML Quick Reference Guide


previous next AddThis Social Bookmark Button


Advertisements

This page is having a quick review of all the HTML tags discussed in this tutorial. If you need to know in detail about any tag then refer to HTML Tag List chapter.

HTML Basic Syntax:

  • HTML Element names and attribute names are not case sensitive.

  • HTML Documents start with a <!doctype...> statement, followed by a header and a text body all enclosed in <html>...</html>.

  • HTML Header is enclosed in <head>....</head> tags.

  • HTML Body is enclosed in <body>....</body> tags.

  • HTML Comments are written as <!-- A comment -->.

HTML Basic Document:

<!DOCTYPE HTML PUBLIC "-//IETF//DTD HTML 4.0//EN">
<html>
<head>
<title>Document Title like HTML Tutorial</title>
</head>

<body>
   Document Text with other tags will come here.
</body>

</html>

Header elements:

  • <head> - Opening tag for the head of the document. The following optional tags can be placed inside the head.

  • <title>...</title> -Document title (not part of the text), recommended maximum length 64 characters.

  • <link ...> - Relationships for the document as a whole: common attributes are rel, rev, href.

  • <base href="url"> - Specifies the base URL of the document. This is used when dereferencing relative URLs in the page.

  • <base href="url" target="..."> - Specifies the base URL of the document. This is used when dereferencing relative URLs in the page. Also specifies the base target frame that all links will default to.

  • <meta ...> - Embed meta-information as if given by the server: attributes http-equiv, name, content.
    <meta http-equiv="refresh" content="N" > - Same page will be reloaded automatically after N seconds.
    <meta http-equiv="refresh" content="N" url="http://www.example.com> - Same other page will refresh automatically after N seconds.
    <meta http-equiv="expires" content="Wed, 08 Aug 2007 01:21:00 GMT" > - Specifies an expiration date for the page so that it will be reloaded after a certain date.
    <meta http-equiv="keywords" content="keyword1, keyword2,..." > - Specifies various keywords available on the page and to be used by the search engine.
    <meta http-equiv="description" content="A short description of the site" > - Specifies small description of the page and to be used by the search engine.

  • <style type="text/css" href="URL" /> - Specifies a CSS file to be used for the web page.

  • <script type="text/scripttype" href="URL" /> - Specifies a Javascript of VBscript file to be used for the web page.

  • <noscript> ... </noscript> - Encloses anything you want displayed by browsers that do not support inline scripts. This goes inside the <script> tags.

  • </head> - Closing tag for the head of the document.

Body Elements:

  • <body>...</body> - Encloses the main body of the document.

  • <hn>...</hn> - Makes the enclosed text a heading of various sizes where n is any number ranging from 1 to 6, and 1 creates the biggest heading while 6 creates the smallest.

  • <basefont size="n"> - Sets the default font properties for the entire page.

  • <isindex attributes> - Displays a text box indicating the presence of a searchable index. Simply adding this tag will not create a searchable page. The server must be set up to support it.

  • <img src="URL" attributes> - Places an inline image into the document.

  • <map attributes>...</map> - Specifies a collection of hot spots that define a client-side image map. The <area> tag can be used inside to define the hot spots.

  • <area attributes>...</area> - Specifies the shape and size of a hot spot to be used in the definition of a client-side image map. Used inside the <map> tag.

  • <marquee attributes>...</marquee> - Places a scrolling text marquee into the document.

  • <applet attributes>...</applet> - Inserts a Java applet in the HTML document. Any text placed between the opening and closing <applet> tags will be displayed by browsers that do not support JAVA.

  • <embed attributes>...</embed> - Inserts an embedded multimedia object, such as a sound file or video, into the page.

  • <a href="...">...</a> - When used with the HREF attribute, the enclosed text and/or graphic becomes a link to another document or anchor. When used with the NAME attribute, the enclosed text and/or graphic becomes an anchor.

  • <ol attributes>...</ol> - Puts the enclosed items marked with <li>, in a numbered list.

  • <ul attributes>...</ul> - Puts the enclosed items marked with <li>, in a bulleted list.

  • <dl>...</dl> - Creates a definition list. Within this container, <dt> specifies a definition term and <dd> specifies the definition.

Frame Elements:

  • <frameset attributes>...</frameset> - Defines a set of frames that will make up the page. The <frame>, and <noframes> tags go inside this. The <frameset> tag is used instead of the <body> tag. You can, however, include a <body> tag inside the <noframes> tags for browsers that do not support frames.

  • <frame attributes /> - Defines a single frame within a frameset.

  • <iframe attributes>...</iframe> - Defines a floating frame. Does not need to be placed within a frameset.

  • <noframes>...</noframes> - Placed inside the <frameset>, anything between the beginning and ending of this tag is viewable only by browsers that do not support frames. This tag is used to create pages that are compatible with older browsers that do not support frames.

Table Elements:

  • <table attributes>...</table> -Creates a table that can include any number of rows.

  • <caption attributes>...</caption> -Specifies the caption of the table.

  • <tr attributes>...</tr> - Specifies a table row. It can enclose the table heading and table data.

  • <th attributes>...</th> - Specifies a table heading.

  • <td attributes>...</td> - Specifies a table data cell.

  • <colgroup attributes /> - Specifies the properties of one or more columns. This tag generally goes right after the opening <table> tag.

  • <col attributes /> - Used with the <colgroup> tag, this specifies the properties of one column. This tag overrides any attributes specified in the <colgroup> tag that comes right before it.

  • <tbody>...</tbody> - Encloses the body of your table. This tag is optional unless you are using the <thead> or <tfoot> tags. It used to separate the rows in the table from those in the header or footer.

  • <tfoot>...</tfoot> - Encloses the table rows that are to be used as a footer. It is an optional tag and comes right after the ending <tbody> element.

  • <thead>...</thead> - Encloses the table rows that are to be used as a header. It is an optional tag and comes before the opening <tbody> element.

Form Elements:

  • <from attributes>...</from> - Specifies a form. Forms can be used to send user input to the server in the form of NAME/VALUE pairs.

  • <input attributes /> - Specifies a control or input area for a form, from which a NAME/VALUE pair will be returned to the server. It could be Checkbox, Raidobox, password, text, reset, submit, hidden and image.

  • <select attributes>...</select> - Creates a drop-down list of items. The list items are defined by the <option> tags placed inside the opening and closing <select> tag.

  • <option value="..." /> - Specifies an item in the drop down list. Placed within the opening and closing <select> tags. Any text following the <option> tag is what the user will see in the list.

  • <textarea attributes>...</textarea> - Creates a multi-lined text entry box. Any text placed in between the tags is used as the default text string that is displayed when the page is loaded.

  • <button attributes>...</button> - allows you to have push buttons on forms that more closely resemble push buttons available in Windows and other applications.

Text Formatting Elements:

  • <address>.....< /address> - Encloses the signature file of the author of the page. Text is displayed in italics.

  • <acronym>.....< /acronym> - indicates an acronym in the text.

  • <b>...< /b> - Boldfaces the enclosed text.

  • <big>...< /big> - Makes the enclosed text one size larger.

  • <blink>.....< /blink> - Makes the enclosed text blink continually.

  • <blockquote>.....< /blockquote> - Encloses a long quote. Both the left and right margins are indented.

  • <br> - Inserts a line break.

  • <center>.....< /center> - Centers the enclosed elements.

  • <cite>.....< /cite> - Encloses a citation such as the title of a book or paper.

  • <code>.....< /code> - Encloses a sample of code. The text is rendered in small font.

  • <comment>.....< /comment> - Encloses a comment. Text inside the tags is ignored unless it contains HTML code.

  • <del>.....< /del> - To mark the document text that has been deleted since a previous version.

  • <dfn>.....< /dfn> - Encloses a definition. Text inside the tags is formatted to look like a definition.

  • <div>...< /div> - Specifies the alignment of the enclosed elements. Can be used to divide a document into sections that are aligned differently.

  • <em>...< /em> - Emphasis on the enclosed text (Italics).

  • <font attributes>...< /font> - Sets the font properties for the enclosed text.

  • <fieldset attributes>...< /fieldset> - Allows you can group related form fields, making your form easier to read and use.

  • <hr attributes /> - Inserts a horizontal line.

  • <i>...< /i> - The enclosed text is italics.

  • <ins>...< /ins> - To mark parts of a document that have been added since the document's last version.

  • <label>...< /label> - Allows you to lable a tag.

  • <kbd>...< /kbd> - Specifies text to be entered at the keyboard. Text is rendered as bold and fixed-width.

  • <p attributes>...< /p> - Designates the enclosed text as a plain paragraph.

  • <q>...</q> - acts much the same as the <blockquote> tag, but applies to shorter quoted sections, ones that don't need paragraph breaks.

  • <pre>.....< /pre> - Displays text in fixed-width type without collapsing spaces.

  • <s>.....< /s> - Displays text with a line through it. The <strike> tag does exactly the same.

  • <samp>...< /samp> - Indicates sample output from a form or program. Text is rendered in small font.

  • <small>...< /small> - Makes the enclosed text one size smaller.

  • <spacer attributes>...< /spacer> - Inserts blocks of spaces into HTML documents.

  • <strong>...< /strong> - Stronger emphasis on the enclosed text.

  • <sub>...< /sub> - Renders the enclosed text in subscript.

  • <sup>...< /sup> - Renders the enclosed text in superscript.

  • <tt>...< /tt> - The enclosed text is typewriter font.

  • <u>...< /u> - The enclosed text in underlined.

  • <var>...< /var> - Specifies a variable. Text is rendered in small fixed-width type.

  • <wbr> - Causes text enclosed by the NOBR tags to wrap only if necessary.


previous next Printer Friendly

Advertisements


  

Advertisements