Ultra fast cheap  linux and windows hosting
html tutorial HTML Tutorial:

  • Html - Introduction
  • Html - A basic html file
  • Html - Meta tags
  • Html - Text Control
  • Html - Color
  • Html - Lists
  • Html - Links
  • Html - Tables
  • Html - Forms
  • Html - frames
  • Html - Background music
  • HTML tag list
  • HTML Character Entities
  • Browse
    html tutorial
    Home >> Tutorials >> HTML Tutorials

    Creating Your First HTML Document:

    <html> </html> tag <head>  </head> tag <body>  </body> tag
    Hiding a section First html doument

    There are certain required elements of HTML to build a web site.When a web browser displays a page , it reads from a plain text file, and looks for special codes or "tags" that are marked by the < - > signs. An HTML has two distinct parts, the head and the body. The head contains information about the document that is not displayed on the screen. The body then contains everything else that is displayed as part of the web page.Below you can see the basic html file:


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
    <html>
    <head>
    <!-- header info used to contain extra information about this document, not displayed on the page -->
    </head>
    <body>
    <!-- all the HTML for display -->
    ---
    ----
    ------
    </body>
    </html>

    (1) <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
    This code will tell the browser what version of HTML the current page is written for.


    (2)<html> </html>

    Every HTML document begins and end with these tags. Their purpose is to tell the browser that the file contains HTML-coded information

    Top


    (3)<head> </head>

    It's used as a type of header which contains important information about a web page .The <head> tag should be placed between the <html> tags preferably at the top of the page. This is not a necessary element of a HTML document but it can and does usually increase its effectiveness. The most commonly used element of the <head> tag are <title> and <meta> tags.The <title> gives your document with a title,which is typically displayed in the title bar at the top of the browser window. Simply write the title of the page between the title tags. The <meta> tag sending messages to search engines about your page. See the details in use of metatags link. There is another tag <base> which can be used to set the default destination frame (target) for all hyperlinks in the document. It is like target property of frame(Refer Frame). Suppose we place <base target = "_blank" > in header tag it would cause all hyperlinks in the document to have a default target of "_blank". Setting the default target only affects hyperlinks for which no target is explicitly declared.If all the hyperlinks in your document have the same target, then it is better to specify the target with <base> than to include an explicit target property in each tag.

    HTML Source Code:

    <html>
    <head>

    <title>This is the title of this document</title>

    </head>

    <body>

    <b>This is an example for giving document title.Look at the top of window for title.<b>

    </body>

    </html>

    Top




    (4)<body> </body> Tag

    The text, pictures and anything else you want on your html page comes between the<body> and </body> tags. The <body> tags should be between the <html> tags and after the <head> tags. The body tag also specifies how the page looks in it's attributes.

    <BODY> Format:
    Eg:

    <body topmargin=20 text="red" bgcolor="yellow" link="blue" vlink="red" alink="green" border="0">

    topmargin -measured in pixels
    leftmargin -measured in pixels

    text       -color of text

    link       -color of link

    vlink      -color of visited links

    alink      -color of active links

    bgcolor    -background color

    background -background image

    title         -text which give description

    HTML Source Code:

    <html>
    <body topmargin=20 text="red" bgcolor="yellow" link="blue" vlink="red" alink="green" bordor="0">

    In this example topmargin = 20<br>

    The text color is red.<Br>

    Link color is blue.<Br>

    Color of visited link color is red.<Br>

    Background color is yellow.<Br>

    <a href="http://www.webgimmicks.com">Webgimmicks</a><Br>

    <a href="http://www.hotmail.com">Hotmail</a><Br>

    </body>

    </html>

     

    Top




    Hiding a section in HTML file (HTML Comment tag).

    You can insert a comment in the source code using the comment tag . The browser will ignore the comment tag. So they will not be visible for the user, but they are still available to the program. It is always A good practice is to comment. You can use comments to explain your code, and this will be helpful when you edit the source code at a later date.

    You can hide a portion of your HTML file while loading by putting between <!-- and --> tags. These tags are very helpful when you want to insert comments in your HTML file.

    <html>
    <body topmargin=20 text="red" bgcolor="yellow" link="blue" vlink="red" alink="green" bordor="0">

    This is an example for hiding a section<Br>

    This line is shown.But the following line is hidden<Br>

    <!--This line is hidden.--><Br>

    This tag is useful when you want to insert comments in your HTML Code

    </body>

    </html>

    Top



    Write first html document

    Are you ready to write your fist html document? The following is a complete example.

    (1) launch your text editor program.
    (2) Enter the following text

     

    <html>
    <head>

    <title>Basic HTML File Example</title>

    <meta name="description" content="Visit this web site for Html Tutorial">

    <META name="keywords" content="html, frame, table">

    </head>

    <body topmargin=20 leftmargin=20>

    This is an example for a basic html file<Br>

    More  in following chapters.....<Br>

    <!-- This line is hidden--><Br>

    </body>

    </html>

    (3) save the document as 'firstscript.html'

    Displaying Your Document in a Web Browser
    (1) Go to the web browser window(Internet Explorer).
    (2)Select Open File... from the File menu. (
    (3)Use the dialog box to find and open the file you created, "firstscript.html"
    You should now see the document.

    Top


    Page contents: itechies.net - Learn how to write a simple html file.
    htmltutorials
    tutorial home