Scribd Logo
Upload

Welcome to Scribd!

  • Lab 10 20122022 035508pm

    Uploaded by

    Maryam Rahim
    17 views6 pages

    Original Title

    Lab-10-20122022-035508pm

    Copyright

    © © All Rights Reserved

    Available Formats

    DOCX, PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    17 views6 pages

    Lab 10 20122022 035508pm

    Uploaded by

    Maryam Rahim

    Copyright:

    © All Rights Reserved
    Download as DOCX, PDF, TXT or read online from Scribd
    Flag for inappropriate content
    of 6

    Lab 10: Introduction to HTML

    INTRODUCTION

    HTML is derived from a language SGML (Standard Graphics Markup Language). HTML is a
    computer language that is used to create documents on the World Wide Web. HTML is very simple,
    and logical. It reads from left to right, top to bottom and uses plain text. HTML is NOT a
    programming language, but a mark-up language that uses <Tags> like this.The websites you view on
    the internet are actually text files that consist of HTML Tags.

    The <HTML> Elements


    The <HTML> element encloses the entire HTML document .The start tag <HTML> should be the
    first thing in HTML file and </HTML> should be the last one.
    The <HEAD> Elements
    The <HEAD> element encloses the head section of the document. The title is always in the Head
    section. It is also optional.
    The <TITLE> Elements
    This element denotes the title of the documents.
    The <H1> Through <H6> (HEADLINE)Elements
    These elements are used for identifying headlines in the document.
    The <H1> element is used to denote the first level headline of an HTML document. There are six
    levels of headlines. The last is <H6>. All headlines must have end tags and be used in consistent.
    The <Body> Elements
    The BODY Elements encloses the body section of the document.
    Attributes
    BACKGROUND—This attribute can be used to specify URL of an image to tile as the
    document background.
    BGCOLOR—This attribute can be used to specify a color of the default background. It uses
    the values of color.
    ALIGN—This attribute is used to specify where on the page the headline is to be displayed
    The <A> (HYPERLINK)Element
    The <A> is used to add a hyperlink to the document. The important attribute is HREF. The
    HREF attributes gives the location of the document to go to when the link is selected.

    Department of Computer Sciences 213/22 Semester BSCS, BSIT 1


    Attributes
    HREF—The HREF attribute specifies that the anchor is the start of a hyperlink. The value of
    HREF is the destination of the hyperlink.
    The <BR> (LINE BREAK) Element
    This element is used for specifying line break in HTML document. The <BR> simply adds a carriage
    return at the location of the tag.
    The Image Elements
    The <IMG> element allows the user to include either GIF or JPEG images in the document. It is also
    used to create clickable image map which are also called inline graphics.
    EXAMPLE
    <html lang = "en">
    <head>
    <title> example of HTML </title>
    </head>
    <body>
    <h1> Aidan's Airplanes </h1>
    <h2> the best in used airplanes</h2>
    <h3> "we have got them by the hangarful"</h3>
    <h2> special of the month </h2>
    <p>
    1960 cessna 210 <br/>
    577 hours since major engine overhaul <br/><br/> 1022 hours since prop overhaul <br/><br/>
    <img src = "images.jpg" alt = "picture of minion"/>
    <br/>
    buy this fine airplane today at a remarkably low price
    <br/>
    call 999-555-1111 today!
    </p>
    </body>
    </html>

    Department of Computer Sciences 214/22 Semester BSCS, BSIT 1


    <p style="color:red;">This is a paragraph.</p>

    <h1 style="background-color:DodgerBlue;">Hello World</h1>

    <h1 style="text-align:center;">Centered Heading</h1>

    The LIST Element


    These are:
    <UL> is used to list item without specific order
    <OL> is used to list item with specific order
    <DL> definition list
    <DT> define a term in description list
    <DD> describe the term in a description list
    <LI> is used to identify the items of list and used within <UL></UL>tags
    EXAMPLE:
    <html lang = "en">
    <head>
    <title> NESTED LISTS </title>
    </head>
    <body>
    <h3> Aircraft types</h3>
    <ol><li> General Aviation (Piston-Driven engines)<ol>
    <li> single Engine Aircraft<ol>
    <li> tail wheel </li>
    <li> tricycle </li>
    </ol> <br/></li>
    <li> Dual Engine Aircraft <ol>
    <li> wing - mounted engines </li>
    Department of Computer Sciences 215/22</li></ol></li> Semester BSCS, BSIT 1
    <li> push pull fuselage-mounted engines
    </ol><br/></li>
    <li> CommercialAviation (jet engines)<ol>
    <li> wing-mounted engine </li>
    <li> fuselage-mounted engine </li>
    </ol> <br/></li>
    <li> Tri- Engine <ol>
    <li> third engine in vertical stablizer </li>
    <li> third engine in fuselage </li>
    </ol></li>
    </ol><br/></li>
    </ol>
    </body>
    </html>

    THE TABLE ELEMENT


    Tables can be used for more than just displaying a table of data. Tables can also be used as formatting
    tool. The data in a table can be text or images.
    The <TABLE> element lets the browser know that a table follows. The attributes to the <table>
    element apply to the table itself not the data displayed in the table.
    Attributes
    • Align—This attribute specifies the alignment of the table.
    • Width—This attribute specifies the width of the table, not columns.
    • Border—The border attribute specifies that the border of the table should be drawn.
    • Cellspacing—This attribute specifies the spacing between cells
    • Cellpadding—This attribute specifies padding within cells.

    The <TR> (TABLE ROW) Element

    Department of Computer Sciences 216/22 Semester BSCS, BSIT 1


    The <TR> is for defining table rows. Inside the <TR> element is found the table header and table
    data element.
    The <TH> (TABLE HEADER) and <TD> (TABLE DATA)
    The <TH> and <TD> are the table cell element. They identify the data to be displayed in the table.
    Each occurrence of <TH> or <TD> within a table row (<TR>) defines a new column

    EXAMPLE
    <html lang = "en"> <head>
    <title> NESTED LISTS </title>
    </head>
    <body>
    <table border = "1" cellpadding = "10" cellspacing = "10">
    <caption> Fruit juice Drinks and Meals </caption>
    <tr>
    <td rowspan = "2"> </td>
    <th colspan = "3"> Fruit juice Drinks </th>
    </tr>
    <tr>
    <th> Apple</th>
    <th> Orange </th>
    <th> ScrewDriver</th>
    </tr>
    <tr>
    <th> Breakfast </th>
    <td> 0 </td>
    <td> 1 </td>
    <td> 0 </td>
    </tr>
    <tr>
    <th> Lunch </th>
    <td> 1 </td>
    <td> 0 </td>
    <td> 0 </td>
    </tr>
    <tr>
    <th> Dinner </th>
    <td> 0 </td>
    <td> 0 </td>
    <td> 1 </td>
    </tr>
    </table>
    </body> </html>

    Department of Computer Sciences 217/22 Semester BSCS, BSIT 1


    Department of Computer Sciences 218/22 Semester BSCS, BSIT 1

    You might also like