HTML Basic Tags HTML Basic Tags | Pejaten Park | Pejaten Park Residence | Apartemen Pejaten Park

HTML Basic Tags

Posted by Raka Satria Mencari Cpanel on Wednesday, January 9, 2013


HTML Basic Tags

The basic structure for all HTML documents is simple and should include the following minimum elements or tags:
  •  - The main container for HTML pages
  •  - The container for page header information
  • </b> - The title of the page</p></li><li><p style="text-align: justify; "><b><body></b> - The main body of the page</p></li></ul><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">Remember that before an opening <html> tag, an XHTML document can contain the optional XML declaration, and it should always contain a DOCTYPE declaration indicating which version of XHTML it uses.</p><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">Now we will explain each of these tags one by one. In this tutorial you will find the terms element and tag are used interchangeably.</p><h2 style="font: normal normal normal 9px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; margin-bottom: 10px; font-size: 16px; margin-top: 10px; background-color: rgb(255, 255, 255); text-align: left; ">The <html> Element:</h2><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">The <html> element is the containing element for the whole HTML document. Each HTML document should have one <html> and each document should end with a closing </html> tag.</p><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">Following two elements appear as direct children of an <html> element:</p><ul style="font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; text-align: left; background-color: rgb(255, 255, 255); "><li><p style="text-align: justify; "><head></p></li><li><p style="text-align: justify; "><body></p></li></ul><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">As such, start and end HTML tags enclose all the other HTML tags you use to describe the Web page.</p><h2 style="font: normal normal normal 9px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; margin-bottom: 10px; font-size: 16px; margin-top: 10px; background-color: rgb(255, 255, 255); text-align: left; ">The <head> Element:</h2><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">The <head> element is just a container for all other header elements. It should be the first thing to appear after the opening <html> tag.</p><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">Each <head> element should contain a <title> element indicating the title of the document, although it may also contain any combination of the following elements, in any order:</p><ul style="font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; text-align: left; background-color: rgb(255, 255, 255); "><li><p style="text-align: justify; ">The <base> tag is used to areate a "base" url for all links on the page. Check HTML Base tag.</p></li><li><p style="text-align: justify; ">The <object> tag is designed to include images, JavaScript objects, Flash animations, MP3 files, QuickTime movies and other components of a page. Check HTML Object tag.</p></li><li><p style="text-align: justify; ">The <link> tag is used to link to an external file, such as a style sheet or JavaScript file. Check HTML Link tag.</p></li><li><p style="text-align: justify; ">The <style> tag is used to include CSS rules inside the document. Check HTML Style tag.</p></li><li><p style="text-align: justify; ">The <script> tag is used to include JAVAScript or VBScript inside the document. Check HTML Script tag.</p></li><li><p style="text-align: justify; ">The <meta> tag includes information about the document such as keywords and a description, which are particularly helpful for search applications. Check HTML Meta tag.</p></li></ul><h2 style="font: normal normal normal 9px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; margin-bottom: 10px; font-size: 16px; margin-top: 10px; background-color: rgb(255, 255, 255); text-align: left; ">Example:</h2><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); ">Following is the example of head tag.</p><table class="src" cellpadding="5" style="font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(170, 170, 170); border-right-color: rgb(170, 170, 170); border-bottom-color: rgb(170, 170, 170); border-left-color: rgb(170, 170, 170); width: 552px; background-color: rgb(255, 255, 255); border-collapse: collapse; padding-left: 5px; vertical-align: top; color: rgb(0, 0, 0); text-align: left; "><tbody><tr><td style="vertical-align: top; margin-bottom: 0px; border-collapse: collapse; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(170, 170, 170); border-right-color: rgb(170, 170, 170); border-bottom-color: rgb(170, 170, 170); border-left-color: rgb(170, 170, 170); "><pre style="font-family: 'Courier New', monospace; font-size: 12px; "><head><br /><title>HTML Basic tags









The Element:</h2><br /><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); "><br />You should specify a title for every page that you write inside the <title> element. This element is a child of the <head> element). It is used in several ways:</p><br /><ul style="font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; text-align: left; background-color: rgb(255, 255, 255); "><br /><li><p style="text-align: justify; "><br />It displays at the very top of a browser window.</p><br /></li><br /><li><p style="text-align: justify; "><br />It is used as the default name for a bookmark in browsers such as IE and Netscape.</p><br /></li><br /><li><p style="text-align: justify; "><br />Its is used by search engines that use its content to help index pages.</p><br /></li><br /></ul><br /><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); "><br />Therefore it is important to use a title that really describes the content of your site. The <title> element should contain only the text for the title and it may not contain any other elements.</p><br /><h2 style="font: normal normal normal 9px/1.5 Helvetica, Arial, 'Liberation Sans', FreeSans, sans-serif; margin-bottom: 10px; font-size: 16px; margin-top: 10px; background-color: rgb(255, 255, 255); text-align: left; "><br />Example:</h2><br /><p style="text-align: justify; font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; background-color: rgb(255, 255, 255); "><br />Here is the example of using title tag.</p><br /><table class="src" cellpadding="5" style="font-family: verdana, helvetica, arial, sans-serif; font-size: 11px; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(170, 170, 170); border-right-color: rgb(170, 170, 170); border-bottom-color: rgb(170, 170, 170); border-left-color: rgb(170, 170, 170); width: 552px; background-color: rgb(255, 255, 255); border-collapse: collapse; padding-left: 5px; vertical-align: top; color: rgb(0, 0, 0); text-align: left; "><tbody><br /><tr><td style="vertical-align: top; margin-bottom: 0px; border-collapse: collapse; border-top-width: 1px; border-right-width: 1px; border-bottom-width: 1px; border-left-width: 1px; border-top-style: solid; border-right-style: solid; border-bottom-style: solid; border-left-style: solid; border-top-color: rgb(170, 170, 170); border-right-color: rgb(170, 170, 170); border-bottom-color: rgb(170, 170, 170); border-left-color: rgb(170, 170, 170); "><pre style="font-family: 'Courier New', monospace; font-size: 12px; "><head><br /><title>HTML Basic tags



The Element:



The element appears after the element and contains the part of the Web page that you actually see in the main browser window, which is sometimes referred to as body content.


A element may contain anything from a couple of paragraphs under a heading to more complicated layouts containing forms and tables.


Most of what you will be learning in this and the following five chapters will be written between the opening tag and closing tag.


Example:



Here is the example of using body tag.



This is a paragraph tag.



Putting all together:

Now if we will put all these tags together, it will constitute a complete HTML document as follows:



HTML Basic tags








This is a paragraph tag.