Scribd Logo
Upload

Welcome to Scribd!

  • 136 views

    Exp - 1 - HTML - Lab Manual

    Uploaded by

    Jyo durga
    This document provides instructions for creating a simple HTML web page using basic HTML elements like headings, paragraphs, and line breaks. It explains what HTML is, common tags used like <h1> for headings and <p> for paragraphs, and how to code and view a basic HTML file using Notepad or Visual Studio Code. The document also includes review questions to test understanding of key concepts covered.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd

    Exp - 1 - HTML - Lab Manual

    Uploaded by

    Jyo durga
    136 views8 pages
    This document provides instructions for creating a simple HTML web page using basic HTML elements like headings, paragraphs, and line breaks. It explains what HTML is, common tags used like <h1> for headings and <p> for paragraphs, and how to code and view a basic HTML file using Notepad or Visual Studio Code. The document also includes review questions to test understanding of key concepts covered.

    Original Title

    Exp_1_HTML_Lab Manual

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    This document provides instructions for creating a simple HTML web page using basic HTML elements like headings, paragraphs, and line breaks. It explains what HTML is, common tags used like <h1> for headings and <p> for paragraphs, and how to code and view a basic HTML file using Notepad or Visual Studio Code. The document also includes review questions to test understanding of key concepts covered.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    136 views8 pages

    Exp - 1 - HTML - Lab Manual

    Uploaded by

    Jyo durga
    This document provides instructions for creating a simple HTML web page using basic HTML elements like headings, paragraphs, and line breaks. It explains what HTML is, common tags used like <h1> for headings and <p> for paragraphs, and how to code and view a basic HTML file using Notepad or Visual Studio Code. The document also includes review questions to test understanding of key concepts covered.

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Download as docx, pdf, or txt
    of 8

    CO2_HTML _LAB MANUAL

    EXP 1- Creating a simple HTML web page with basic HTML


    Elements

    1.1 AIM: - To create a simple HTML web page with basic HTML Elements

    1.2 Objectives: To understand concept of Design of simple static web page with HTML

    1.3 Apparatus: Desktop or Laptop with any operating system like UNIX, LINUX and
    Windows.

    1.4 Software: Notepad or Notepad++ or Visual Studio Code and any web Browser like
    Internet Explorer, Goggle Chrome, and Mozilla Firefox etc.

    1.5 Theory Part:

    A.What is HTML?
     A series of tags that are integrated into a text document.
     A series of tags that are integrated into a text document.
     These look like: <code>formatted text</code>
    o <code> begins the formatting tag.
    o </code> ends the formatting tag.
     These tags are then read by a Browser, which translates the
    tags into the formatting that they represent

    B.What are Tags?


     HTML tags are used to mark-up HTML elements.
     HTML tags are surrounded by the two characters < and >.
     The surrounding characters are called angle brackets.
     HTML tags normally come in pairs like <b> and </b>.
     The first tag in a pair is the start tag; the second tag is the end tag.
     The text between the start and end tags is the element content.

     HTML tags are not case sensitive; <b> means the same as <B>.
    C.Structure Tags In
    HTMLTag
    <HTML></HTML>
    These tags begin and end an HTML document.

    HEAD Tag
    <HEAD></HEAD>
    These tags are in the beginning of the document. Important
    information is stored in- between these tags including: title,
    styles, and programming scripts
    TITLE Tag
    <TITLE></TITLE>
    These tags are in-between the HEAD tags and
    contain the text that appears in the title of the Web
    page.
    BODY Tag
    <BODY></BODY>
    As you may have guessed, the BODY tags contain all
    the text in the body of the document.

    D.Block Level tags


    HTML Headings –
    Headings are defined with the<h1> to<h6> tags.
    Where, <h1> - Defines the largest headings.
    <h6> -Defines the smallest headings.

    HTML Paragraphs -

    Paragraphs are defined with the<p> tag.

    HTML Line Breaks -


    Use the <br/> tag if you want a line break (a new line) without
    starting a new paragraph.
    1.6 Procedure:
    i. Use a text editor such as Notepad to write the document.
    ii. Save the file as filename.html on a PC. This is called the Document Source.
    iii. Open the file that you have saved in any browser Off-Line.
    iv. Your HTML page should now appear just like any other Web page in
    browser.
    v. You may now switch back and forth between the Source and the HTML
    Document
     switch to Notepad with the Document Source
     Make changes.
     Save the document again.
     Switch back to browser.
     click on RELOAD and view the new HTML Document switch to
    Notepad with the Document Source

    I. HTML Using Notepad or Text Edit:

    Web pages can be created and modified by using professional HTML editors.
    However, for learning HTML we recommend a simple text editor like Notepad
    (PC) or Text Edit (Mac).

    Follow the steps below to create your first web page with Notepad or Text Edit.

    Step 1: Open Notepad (PC)

    Windows 8 or later:

    Open the Start Screen (the window symbol at the bottom left on your screen).
    Type Notepad.

    Windows 7 or earlier:

    Open Start > Programs > Accessories > Notepad

    Step 1: Open TextEdit (Mac)

    Open Finder > Applications > TextEdit

    Also change some preferences to get the application to save files


    correctly. In Preferences > Format > choose "Plain Text"

    Then under "Open and Save", check the box that says "Display HTML files as
    HTML code instead of formatted text".
    Then open a new document to place the code.

    Step 2: Write Some HTML Code

    Write the following HTML code into Notepad:

    <! DOCTYPE HTML >


    <html>
    <body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
    </body>
    </html>

    Step 3: Save the HTML Page

    Save the file on your computer. Select File > Save as in the Notepad menu.

    Name the file "index.htm" and set the encoding to UTF-8 (which is the


    preferred encoding for HTML files).
    Tip: You can use either .htm or .html as file extension. There is no difference, it
    is up to you.

    Step 4: View the HTML Page in Your Browser

    Open the saved HTML file in your favourite browser (double clicks on the file,
    or right-click - and choose "Open with").

    The result will look much like this:


    II. HTML Using Visual Studio Code:

    Step 1 code: Basic elements Title, heading and paragraph.

    Step 1 out-put:
    Step 2 code: HTML headings are defined with the <h1> to <h6> tags.

    Step 2 out-put:

    Step 3 Code : line break


    <!DOCTYPE html>
    <html>
    <body> 

    <p>This is a <br> paragraph with a line break.</p>

    </body>
    </html>

    Step 3 out-put:

    1.7 Result: Hence Simple web page created by using HTML code

    1.8 Viva Questions:

    1. What is internet?
    2. What is www?
    3. What are Web Site, Web Browser and Web Server?
    4. www is based on which model?
    5. What is meant by URL?
    6. What is HTML?
    7. What are Tags?
    8. What are the basic elements of HTML?
    9. How many types of heading does an HTML contain?
    10. Do all HTML tags have an end tag?

    You might also like