Structured HTML tags are like keywords define that how a web browser will format and display the content. With the help of tags, a web browser can distinguish between HTML content and simple content. HTML tags contain three main parts: an opening tag, content, and closing tag. But some HTML tags are unclosed tags. HTML tags are used to create HTML documents and render their properties. Each HTML tags have different properties. All HTML tags must enclosed within < > these brackets.<\/p>\n
<body>…<\/body><\/strong> Attributes<\/strong> background=url link=”#rrggbb” or color name text=”#rrggbb” or color name vlink=”#rrggbb” or color name <head>…<\/head><\/strong> <html>…<\/html><\/strong> <link><\/strong> Attributes<\/strong> methods=list rev=relation rel=relation rel=stylesheet title=text type=resource <meta><\/strong> Attributes<\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n content=text name=text scheme=text <title>…<\/title><\/strong> Setting Up an HTML Document<\/p>\n The standard skeletal structure of an HTML document is as follows: <HTML> <\/HTML><\/strong> The Document Header<\/strong><\/p>\n The header, delimited by the <head> tag, contains information that describes the HTML document. The head tag has no attributes of its own but merely serves as a container for other tags that help define and manage the document\u2019s contents. The most commonly used element within the header is the document title (within <title> tags, as shown in the example above), which provides a description of the page\u2019s contents. The title is also used as the name of the link as displayed in a user\u2019s bookmarks or \u201chot list.\u201d Search engines rely heavily on document titles as well. For all these reasons, it is important to provide thoughtful and descriptive titles for all your documents and avoid vague titles such as \u201cWelcome,\u201d or \u201cMyPage.\u201d<\/p>\n<\/div>\n<\/div>\n<\/div>\n Other useful HTML elements are also placed within the <head> tags of a document:<\/p>\n <base><\/strong> Creating Links. <meta><\/strong> <script><\/strong> <style><\/strong> You can use the <body> tag to set colors for the background and text elements<\/p>\n Page Element HTML TAG Description<\/strong><\/p>\n Background color<\/strong> Links <BODY LINK=”color”> Sets the color for hyperlinks. Visited link <BODY VLINK=”color”> Sets the color for links that have already been clicked. The default color for visited links is purple.<\/p>\n<\/div>\n<\/div>\n<\/div>\n Active link <BODY ALINK=”color”> Sets the color for a link while it is in the process of being clicked. The default color for an active link is red.<\/p>\n Paragraphs and Headings<\/strong> (Block-Level Elements)<\/p>\n Block-level elements are always formatted with a line-break before and after, with most adding some amount of additional space above and below as well. The most commonly used block elements are paragraphs (<p>), headings (<h1…h6>), and <address>…<\/address><\/strong> <blockquote>…<\/blockquote><\/strong> <div>…<\/div><\/strong> Attributes<\/strong> <hn>…<\/hn><\/strong> Attributes<\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n align=center|left|right<\/p>\n Used to align the header left, right, or centered on the page. Microsoft Internet Explorer 3.0 and earlier do not support the right alignment.<\/p>\n <p>…<\/p><\/strong> Attributes<\/strong> <abbr>…<\/abbr><\/strong> Attributes<\/strong> <acronym>…<\/acronym><\/strong> Attributes<\/strong> <b>…<\/b><\/strong> <big>…<\/big><\/strong> <blink>…<\/blink><\/strong> <cite>…<\/cite><\/strong> <code>…<\/code><\/strong> <del>…<\/del><\/strong> <em>…<\/em><\/strong> <font>…<\/font><\/strong> Attributes<\/strong> face=typeface (or list of typefaces) size=value <i>…<\/i><\/strong> <ins>…<\/ins><\/strong> <s>…<\/s><\/strong> <small>…<\/small><\/strong> <strike>…<\/strike><\/strong> <strong>…<\/strong><\/strong> <sub>…<\/sub><\/strong> <sup>…<\/sup><\/strong> <tt>…<\/tt><\/strong> <u>…<\/u><\/strong> <br><\/strong> <center>…<\/center><\/strong> The following is a collection of tags used for formatting a number of different types of lists in HTML. Any list can be nested within another list.<\/p>\n <dir>…<\/dir><\/strong> <dl>…<\/dl><\/strong> <dd>…<\/dd><\/strong> <dt>…<\/dt><\/strong><\/p>\n Denotes the term portion of an item within a definition list. The closing tag is normally omitted but should be included when applying style sheets.<\/p>\n<\/div>\n<\/div>\n<\/div>\n <li>…<\/li><\/strong> value=number <menu>…<\/menu><\/strong> type=disc|circle|square <ol>…<\/ol><\/strong> Attributes<\/strong> start=number <ul>…<\/ul><\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n Defines the beginning and end of an ordered list, which consists of list items <li>.<\/p>\n Attributes<\/strong><\/p>\n compact type=disc|circle|square <a>…<\/a><\/strong> Attributes<\/strong> method=value Link Examples<\/strong> Setting Colors in <body><\/strong><\/p>\n Link color specifications in the <body> tag are applied to the whole document.<\/p>\n Specifying Color for a Specific Link<\/strong><\/p>\n<\/div>\n<\/div>\n<\/div>\n You can override the color of a specific link by placing <font> tags within the anchor tags. There is no way to set the visited link and active link colors for specific links. This feature is supported by versions 3.0 and 4.0 of Internet Explorer, but only version 4.0 of Netscape Navigator. Setting Global-Link Colors with Style Sheets<\/strong><\/p>\n You can apply almost any style sheet property to a link by using the anchor tag (<a>) as a selector. However, CSS1 introduced a group of pseudo-classes (link, Links <BODY LINK=”color”> Sets the color for hyperlinks. The default color for links is blue. Active links <BODY ALINK=”color”> Sets the color for a link while it is in the process of being clicked. The default color for an active link is red.<\/p>\n <hr><\/strong> noshade size=number width=number or % <img><\/strong> Type Resulting Alignment bottom Aligns the bottom of the image with the text baseline. This is the default vertical alignment. center According to the W3C Spec, this centers the image horizontally on the page; however, in reality, browsers treat it the same as align=middle.<\/p>\n alt=text border=number height=number hspace=number If you liked our content Structured HTML Tags, then you will also like\u00a0CSS Selectors\u00a0<\/a><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"excerpt":{"rendered":"
\nDefines the beginning and the end of the document body. The body contains the content of the document (the part that is displayed in the browser window). Attributes to the <body> tag affect the entire document.<\/p>\n
\nalink=”#rrggbb” or color name
\nSets the color of active links (i.e., the color while the mouse button is held down during a \u201cclick\u201d). Color is specified in hexadecimal RGB values or by standard web color name. Chapter 5, HTML Overview, explains how to specify color in HTML.<\/p>\n
\nProvides the URL to a graphic file to be used as a tiling graphic in the background of the document. bgcolor=”#rrggbb” or color name
\nSets the color of the background for the document. Color is specified in hexadecimal RGB values or by standard web color name.<\/p>\n
\nSets the default color for all the links in the document. Color is specified in hexadecimal RGB values or by standard web color name.<\/p>\n
\nSets the default color for all the text in the document. Color is specified in hexadecimal RGB values or by standard web color name.<\/p>\n
\nSets the color of the visited links for the document. Color is specified in hexadecimal RGB values or by standard web color name.<\/p>\n<\/div>\n<\/div>\n<\/div>\n<head><\/h3>\n
\nDefines the head (also called \u201cheader\u201d) portion of the document that contains information about the document. The <head> tag has no attributes, but serves only as a container for the other header tags, such as <base>, <meta>, and <title>.<\/p>\n
\nPlaced at the beginning and end of the document, this tag tells the browser that the entire document is composed in HTML.<\/p>\n
\nDefines a relationship between the current document and another document. This tag goes within the <head> portion of the document. It is often used to refer to an external stylesheet.<\/p>\n
\nhref=url
\nIdentifies the target document.<\/p>\n
\nSpecifies a browser-dependent list of comma-separated display methods for this link. It is not commonly used.<\/p>\n
\nSpecifies the relationship from the target document to the source.<\/p>\n
\nSpecifies the relationship from the current source document to the target.<\/p>\n
\nThis attribute is used within the <link> tag to create a relationship with an external stylesheet.<\/p>\n
\nProvides a title for the target document.<\/p>\n
\nShows the type of outside link. The value text\/CSS indicates that the linked document is an external cascading style sheet<\/p>\n<meta><\/h3>\n
\nProvides additional information about the document. It should be placed within the <head> tags at the beginning of the document. It is commonly used for making documents searchable (by adding keywords) and may be used for client pull functions.<\/p>\n
\nSpecifies the value of the meta tag and is always used in conjunction with name= or http-equiv=. http-equiv=text
\nSpecifies information to be included in the HTTP header that the server appends to the document. It is used in conjunction with the name attribute.<\/p>\n
\nSpecifies a name for the meta information.<\/p>\n
\nProvides additional information for the interpretation of meta data. This is a new attribute introduced in HTML 4.0.<\/p>\n<title><\/h3>\n
\nSpecifies the title of the document. The title generally appears in the top bar of the browser window<\/p>\n
\n<HEAD><TITLE>Document Title<\/TITLE><\/HEAD> <BODY>Contents of Document<\/BODY><\/p>\n
\nThe HTML standard requires that the entire document appears within the <html> container, however, most browsers can properly display the contents of the document even if these tags are omitted. All HTML documents are made up of two main structures, the head (also called the \u201cheader\u201d) and the body. The exception to this rule is when the document contains a frameset in place of the body.<\/p>\n
\nTitles<\/p>\nOther header elements<\/strong><\/h3>\n
\nThis tag establishes the document\u2019s base location, which serves as a reference for all the links in the document.<\/p>\n
\n<link><\/strong>
\nThis tag defines the relationship between the current document and another document. Although it can signify relationships such as index, next, and previous, it is most often used today to link a document to an external style sheet.<\/p>\n
\n\u201cMeta\u201d tags are used to provide information about a document, such as
\nkeywords or descriptions to aid search engines. It may also be used for clientpull
\nfunctions. The <meta> tag is discussed later in this chapter.<\/p>\n
\nJavaScripts and VBScripts may be added to the document within its header.<\/p>\n
\nEmbedded style sheets must be added to the document header by placing the
\n<style> element within the <head> container.
\n.
\nThe Document Body<\/strong>
\nThe document body, delimited by <body> tags, contains the contents of the document -the part that you want to display in the browser window.
\nThe body of an HTML document might consist of just a few paragraphs of text, a single image, or a complex combination of text, images, tables, and multimedia objects. What you put on the page is up to you.<\/p>\n
\n<BODY BGCOLOR=”color”> Sets the color for the background of the entire page.
\nRegular text <BODY TEXT=”color”> Sets the color for all the regular text in the document. The default color for text is black.<\/p>\n
\nThe default color for links is blue.<\/p>\nFormatting Text<\/h3>\n
\nblockquotes (<blockquote>).<\/p>\n
\nIdentifies ownership or authorship information, typically at the beginning or end of a document. Addresses are generally formatted in italic type with a line break (but no extra space) above and below.<\/p>\n
\nEnclosed text is a blockquote, which is generally displayed with an indent on the left and right margins and added space above and below the paragraph.
\nNote that:
\n\u2022 Some older browsers display blockquote material in italic, making it difficult to read.
\n\u2022 Browsers are inconsistent in the way they display images within blockquotes.
\nSome align the graphic with the indented blockquote margin; others align the image with the normal margin of paragraph text. It is a good idea to test on a variety of browsers.<\/p>\n
\nDenotes the beginning and end of a division of the page. First introduced in HTML
\n3.2 as a way to define a unique style for each division, only the alignment function (using the align attribute) was implemented by the major browsers. The <div> tag has proven itself enormously valuable, however, when used in conjunction with style sheets.<\/p>\n
\nalign=center|left|right
\nAligns the text within the tags to the left, right, or center of the page.<\/p>\n
\nSpecifies that the enclosed text is a heading. There are six different levels of headings, from <h1> to <h6>, with each subsequent level displaying at a smaller size. <h5> and <h6> usually display smaller than the surrounding body text.<\/p>\n
\nDenotes the beginning and end of a paragraph when used as a container. Many browsers will also allow the <p> tag to be used without a closing tag to start a new paragraph. The container method is preferred, particularly if you are using Cascading Style Sheets with the document.<\/p>\n
\nalign=center|left|right
\nAligns the text within the tags to the left, right, or center of the page.<\/p>\n
\nIdentifies the enclosed text as an abbreviation. It has no inherent effect on text display, but can be used as an element selector in a style sheet.<\/p>\n
\ntitle=string
\nProvides the full expression for the abbreviation. This may be useful for nonvisual browsers and search engines.
\nExample
\n<ABBR TITLE=”Massachusetts”>Mass.<\/ABBR><\/p>\n
\nIndicates an acronym. It has no inherent effect on text display, but can be used as an element selector in a style sheet.<\/p>\n
\ntitle=string
\nProvides the full expression for the acronym. This may be useful for nonvisual browsers and search engines.
\nExample
\n<ACRONYM TITLE=”World Wide Web”>WWW<\/ACRONYM><\/p>\n
\nEnclosed text is rendered in bold.<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\nSets the type one font size larger than the surrounding text. It is equivalent to <font size=”+1″>.<\/p>\n
\nCauses the contained text to flash on and off.<\/p>\n
\nDenotes a citation\u2014a reference to another document, especially books, magazines, articles, etc. Browsers generally display citations in italic.<\/p>\n
\nDenotes a code sample. Code is rendered in the browser\u2019s specified monospace font (usually Courier).<\/p>\n
\nIndicates deleted text. It has no inherent style qualities on its own, but may be used to hide deleted text from view or display it as strike-through text via style sheet controls. It may be useful for legal documents and any instance where edits need to be tracked. Its counterpart is inserted text (<ins>). Both can be used to indicate either inline or block-level elements.<\/p>\n
\nIndicates emphasized text. Nearly all browsers render emphasized text in italic.<\/p>\n
\nUsed to affect the style (color, typeface, and size) of the enclosed text.<\/p>\n
\ncolor=”#rrggbb”
\nSpecifies the color using a hexadecimal RGB value.<\/p>\n
\nSpecifies a typeface for the text. The specified typeface will be used only if it is found on the user\u2019s machine. You may provide a list of fonts (separated by commas) and the browser will use the first available in the string.<\/p>\n
\nSets the size of the type to an absolute value on a scale from 1 to 7 (3 is the default), or using a relative value +n or -n (based on the default or <basefont> setting).<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\nEnclosed text is displayed in italic.<\/p>\n
\nIndicates text that has been inserted into the document. It has no inherent style qualities on its own, but may be used to indicate inserted text in a different color via style sheet controls. It may be useful for legal documents and any instance in which edits need to be tracked. Its counterpart is deleted text (<del>). Both can be used to indicate either inline or block-level elements.<\/p>\n
\nThe enclosed text is displayed as strike-through text (same as <strike> but introduced by later browser versions).<\/p>\n
\nRenders the type one font size smaller than the surrounding text. It is equivalent to <font size=”- 1″>.<\/p>\n
\nThe enclosed text is displayed as strike-through text (crossed through with a horizontal line).<\/p>\n
\nThe enclosed text is strongly emphasized. Nearly all browsers render <strong> text in bold.<\/p>\n
\nFormats enclosed text as subscript.<\/p>\n
\nFormats enclosed text as superscript.<\/p>\n
\nFormats enclosed text as typewriter text. The text enclosed in the <tt> tag will be displayed in a monospaced font such as Courier.<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\nEnclosed text will be underlined when displayed.<\/p>\nSpacing and Positioning<\/h3>\n
\nBreaks the text and begins a new line, but does not add extra space as the <p> tag does. Attributes<\/strong>
\nclear=all|left|right
\nBreaks the text flow and resumes the next line after the specified margin is clear. This is often used to start the text below an aligned image (preventing text wrap).<\/p>\n
\nCenters the enclosed text horizontally on the page (same as <DIV align=center>.<\/p>\nLists<\/h3>\n
\nCreates a directory list consisting of list items <li>. Directory lists were originally designed to display lists of files with short names, but they have been deprecated with the recommendation that unordered lists (<ul>) be used instead. Most browsers render directory lists the same as unordered lists (with bullets), although some will use a multicolumn format.<\/p>\n
\nIndicates a definition list, consisting of terms (<dt>) and definitions (<dd>).<\/p>\n
\nDenotes the definition portion of an item within a definition list. The definition is usually displayed with an indented left margin. The closing tag is commonly omitted but should be included when applying style sheets.<\/p>\n
\nDefines an item in a list. It is used within the <dir>, <ol>, and <ul> list tags.
\nAttributes<\/strong>
\nThe following attributes have been deprecated by the HTML 4.0 Specification in favor of style sheet controls for list item display.
\ntype=format
\nChanges the format of the automatically generated numbers or bullets for list items. Within unordered lists (<ul>), the type attribute can be used to specify the bullet style (disc, circle, or square) for a particular list item. Within ordered lists (<ol>), the type attribute specifies the numbering style (see options under <ol> listing below) for a particular list item.<\/p>\n
\nWithin ordered lists, you can specify the number (n) of an item. The following list items will increase from the specified number.<\/p>\n
\nThis indicates the beginning and end of a menu list, which consists of list items <li>. Menus are intended to be used for a list of short choices, such as a menu of links to other documents. It is little used and has been deprecated in favor of <ul>.
\nAttributes<\/strong>
\ncompact
\nDisplays the list as small as possible (not many browsers do anything with this attribute).<\/p>\n
\nDefines the shape of the bullets used for each list item.<\/p>\n
\nDefines the beginning and end of an ordered list, which consists of list items <li>.<\/p>\n
\ncompact
\nDisplays the list as small as possible (not many browsers do anything with this attribute).<\/p>\n
\nStarts the numbering of the list at n, instead of 1.
\ntype=1|A|a|I|i<\/p>\n
\nDisplays the listed block as small as possible. Not many browsers support this attribute.<\/p>\n
\nDefines the shape of the bullets used for each list item.<\/p>\nCreating Links<\/h3>\n
\nDefines an anchor within the document. An anchor is used to link to another document. It can also serve to label a fragment within a document (also called a named anchor), which is used as a reference for linking to a specific point in an HTML document.<\/p>\n
\nhref=url
\nSpecifies the URL of the target destination.<\/p>\n
\nSpecifies a list of names, each representing a particular document-processing method, usually an application name. It is browser-dependent and is rarely used in practice.<\/p>\n
\n– To a local file:
\n<A HREF=”filename.html”>…<\/A>
\n– To an external file:
\n<A HREF=”http:\/\/server\/path\/file.html”>…<\/A>
\n– To a named anchor:
\n<A HREF=”http:\/\/server\/path\/file.html#fragment”>…<\/A>
\n– To a named anchor in the same file:
\n<A HREF=”#fragment”>…<\/A>
\n– To send an email message:
\n<A HREF=”mailto:username@domain”>…<\/A>
\n– To a file on an FTP server:
\n<A HREF=”ftp:\/\/server\/path\/filename”>…<\/A><\/p>\n
\n<A HREF=”document.html”><FONT COLOR=aqua> Specially colored link<\/FONT><\/A><\/p>\n
\nVisited links <BODY VLINK=”color”> Sets the colors for links that have already been clicked. The default color for visited links is purple.<\/p>\n
\nAdds a horizontal rule to the page.
\nAttributes<\/strong>
\nalign=center|left|right
\nIf the rule is shorter than the width of the window, this tag controls the horizontal alignment of the rule. The default is center.<\/p>\n
\nThis displays the rule as a solid (non-shaded) bar.<\/p>\n
\nSpecifies the thickness of the rule in pixels.<\/p>\n
\nSpecifies the length of the rule in pixels or as a percentage of the page width. By default, rules are the full width of the browser window.<\/p>\n
\nPlaces a graphic on the page.
\nAttributes<\/strong>
\nalign=type
\nSpecifies the alignment of an image using one of the following attributes:<\/p>\n
\nabsbottom Navigator 3.0 & 4.0 and Internet Explorer 4.0 only. Aligns the bottom of the image with the bottom of the current line.
\nabsmiddle Navigator 3.0 & 4.0 and Internet Explorer 4.0 only. Aligns the middle of the image with the middle of the current line. baseline Navigator 3.0 & 4.0 and Internet Explorer 4.0 only. Aligns the bottom of the image with the baseline of the current line.<\/p>\n<\/div>\n<\/div>\n<\/div>\n
\nProvides a string of alternative text that appears when the image is not displayed.<\/p>\n
\nSpecifies the width (in pixels) of the border that surrounds a linked image. It is standard practice to set border=0 to turn the border off.<\/p>\n
\nSpecifies the height of the image in pixels. It is not required but recommended to speed up the rendering of the web page.<\/p>\n
\nUsed in conjunction with the align attribute, this attribute specifies in a number of pixels the amount of space to leave clear to the left and right of the image.<\/p>\n