Scribd Logo
Upload

Welcome to Scribd!

  • CSE 20CS01P U1 S2 Pr2

    Uploaded by

    manjunath.ok1
    6 views18 pages
    IT SKILLS LAB

    Original Title

    CSE_20CS01P_U1_S2_Pr2

    Copyright

    © © All Rights Reserved

    Available Formats

    PPTX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    IT SKILLS LAB

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pptx, pdf, or txt
    6 views18 pages

    CSE 20CS01P U1 S2 Pr2

    Uploaded by

    manjunath.ok1
    IT SKILLS LAB

    Copyright:

    © All Rights Reserved
    Download as PPTX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    Download as pptx, pdf, or txt
    of 18

    Department of Collegiate and Technical Education

    IT SKILLS - 20CS01P
    (Common to All Engineering Branches)

    Computer Science & Engineering – 20CS01P


    Department of Collegiate and Technical Education

    Unit 2 : DESIGN AND DEVELOP WEB PAGES

    Session 2
    : 2.1 - Introduction, Editors, Tags

    : Creating Web-pages
    Session Outcome

    Computer Science & Engineering – 20CS01P


    CONTENTS

    What is web page? What is HTML?

    HTML Editors HTML Tags

    Activities

    Computer Science & Engineering – 20CS01P


    What is a Webpage ?

    A web page is a single hypertext document available on World Wide Web


    (WWW). It is composed of HTML elements and displayed on the user's
    browser such as Mozilla, Firefox, Chrome, etc. It is also referred to as "Page."

    Computer Science & Engineering – 20CS01P


    What is HTML?

    • HTML stands for Hyper Text Markup Language


    • HTML is the standard markup language for creating Web pages
    • HTML describes the structure of a Web page
    • HTML elements tell the browser how to display the content
    • It allows us to organize text, graphics, audio, and video on a web page

    Computer Science & Engineering – 20CS01P


    A Simple HTML Document

    <!DOCTYPE html>
    <html>
    <head><title>Page Title</title></head>
    <body>
    <h1>My First Heading</h1>
    <p>My first paragraph.</p>
    </body>
    </html>
    Computer Science & Engineering – 20CS01P
    What is an HTML Element?

    An HTML element is defined by a start tag, some content, and an end tag:
    <tag name> Content goes here... </tag name>
    The HTML element is everything from the start tag to the end tag:

    Start tag Element content End tag

    <h1> My First Heading </h1>

    <p> My first paragraph. </p>

    <br> none None

    Computer Science & Engineering – 20CS01P


    HTML Editors

    Web pages can be created and modified by using professional HTML editors.
    Follow the steps below to create your first web page with Notepad or TextEdit
    Step 1: Open Notepad (PC)
    Step 2: Write Some HTML

    Computer Science & Engineering – 20CS01P


    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).

    Computer Science & Engineering – 20CS01P


    Step 4: View the HTML Page in Your Browser

    • Open the saved HTML file in your favorite browser (double click on the
    file, or right-click - and choose "Open with").
    • The result will look much like this

    Computer Science & Engineering – 20CS01P


    HTML Tags:

    • HTML tags are like keywords which defines that how web browser will
    format and display the content.
    • With the help of tags, a web browser can distinguish between an HTML
    content and a simple content.
    • HTML tags contain three main parts: opening tag, content and closing tag.
    But some HTML tags are unclosed tags.

    Computer Science & Engineering – 20CS01P


    HTML Tags :

    • All HTML tags must enclosed within < > these brackets.
    • Every tag in HTML perform different tasks.
    • If you have used an open tag <tag>, then you must use a close tag </tag>
    (except some tags)
    • Syntax :
    • <tag> content </tag>

    Computer Science & Engineering – 20CS01P


    HTML Tag Examples :

    • <p> Paragraph Tag </p>


    • <h2> Heading Tag </h2>
    • <b> Bold Tag </b>
    • <i> Italic Tag </i>
    • <u> Underline Tag</u>

    Computer Science & Engineering – 20CS01P


    HTML Tags :

    Tag name Description

    <!-- --> This tag is used to apply comment in an HTML document.

    <!DOCTYPE> This tag is used to specify the version of HTML


    Tag name Description

    <!-- --> This tag is used to apply comment in an HTML document.

    <!DOCTYPE> This tag is used to specify the version of HTML


    <a> It is termed as anchor tag and it creates a hyperlink or link.

    <b> It is used to make a text bold.

    <body> It is used to define the body section of an HTML document.

    Computer Science & Engineering – 20CS01P


    Tag name Description

    <center> It is used to align the content in center. (Not supported in


    HTML5)

    <div> It defines a division or section within HTML document.

    <font> It defines the font, size, color, and face for the
    content. (Not supported in HTML5)

    <form> It is used to define an HTML form.

    <h1> to <h6> It defines headings for an HTML document from level 1


    to level 6.
    Computer Science & Engineering – 20CS01P
    Tag name Description

    <header> It defines the header of a section or webpage.

    <hr> It is used to apply thematic break between paragraph-level


    elements.

    <html> It represents root of an HTML document.

    <img> It is used to insert an image within an HTML document.

    <li> It is used to represent items in list.

    Computer Science & Engineering – 20CS01P


    Activity – Creating Web-pages

    Practice creating
    Practice Paragraph
    simple HTML
    & Heading tags
    document

    Practice header and


    title tags

    Computer Science & Engineering – 20CS01P


    Thank you

    GAYATHRI SJP, BENGALURU 102

    PRASANNA KUMAR B R GWPT, SHIRALKOPPA 143

    RAMYA S YAMIKAR DRR GPT, DAVANGERE 106

    SUKANYA SAJJAN GPT, RAMANAGARA 159

    Computer Science & Engineering – 20CS01P

    You might also like