Scribd Logo
Upload

Welcome to Scribd!

  • 02 Handout 1

    Uploaded by

    Hannah Gabrielle D. Caling
    5 views3 pages
    Computer Programming 2

    Original Title

    02_Handout_1(12)

    Copyright

    © © All Rights Reserved

    Available Formats

    PDF, TXT or read online from Scribd

    Did you find this document useful?

    Is this content inappropriate?

    Report this Document
    Computer Programming 2

    Copyright:

    © All Rights Reserved
    Download as PDF, TXT or read online from Scribd
    Flag for inappropriate content
    5 views3 pages

    02 Handout 1

    Uploaded by

    Hannah Gabrielle D. Caling
    Computer Programming 2

    Copyright:

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

    SH1802

    HTML Basics (Part 1)


    I. Paragraphs

    A. The <P> Element


    • A tag pair that allows the creation of paragraphs in an HTML document:
    <HTML>
    <HEAD>
    <TITLE>first page</TITLE>
    </HEAD>
    <BODY>
    <P>This is a paragraph. </P>
    <P>This is another paragraph. </P>
    </BODY>
    </HTML>

    B. Single Line Break


    • Used to add a single line of text without starting a new paragraph:
    <HTML>
    <HEAD>
    <TITLE>first page</TITLE>
    </HEAD>
    <BODY>
    <P>This is a paragraph.</P>
    <P>This is another paragraph. </P>
    <P>This is <BR /> a line break </P>
    </BODY>
    </HTML>

    II. Text Formatting


    • In HTML, there is a list of elements that specify text style.
    • These formatting elements were designed to display special types of text:
    o <B> - defines bold text.
    o <BIG> - defines text with a bigger font size; now considered an obsolete HTML element.
    o <I> - defines italicized text.
    o <SMALL> - defines text with a smaller font size; now considered obsolete.
    o <STRONG> - defines important text; text will look almost the same as bold text.
    o <SUB> - defines subscripted text.
    o <SUP> - defines superscripted text.
    o <INS> - defines inserted text; text will usually be displayed with underline.
    o <DEL> - defines text that has been deleted from a document; text will usually be displayed
    with a strikethrough (a horizontal line in the middle of the text).
    o <EM> - defines emphasized text; text will looks almost the same as italicized text.

    III. HTML Headings, Lines and Comments

    A. HTML Headings
    • HTML includes six levels of headings, which are ranked according to importance. These
    are labelled <H1> to <H6>, respectively:

    02 Handout 1 *Property of STI


     courseware.feedback@sti.edu Page 1 of 3
    SH1802

    <HTML>
    <HEAD>
    <TITLE>first page</TITLE>
    </HEAD>
    <BODY>
    <H1>This is heading 1</H1>
    <H2>This is heading 2</H2>
    <H3>This is heading 3</H3>
    <H4>This is heading 4</H4>
    <H5>This is heading 5</H5>
    <H6>This is heading 6</H6>
    </BODY>
    </HTML>

    B. Horizontal Lines
    • Uses the <HR /> tag for its declaration:
    <HTML>
    <HEAD>
    <title>first page</title>
    </HEAD>
    <BODY>
    <P>This is a paragraph </P>
    <hr />
    <P>This is a paragraph </P>
    </BODY>
    </HTML>

    C. Comments
    • These are not displayed by the browser, but read by the compiler.
    • Helps document HTML code by adding descriptions, reminders, and other notes:
    <!-- Your comment goes here -->

    IV. Elements
    • HTML documents are made up of HTML elements.
    • An HTML element is written using a start tag and an end tag, with the content in between.
    • HTML elements can be nested within the HTML document:
    <HTML>
    <HEAD>
    <TITLE>first page</TITLE>
    </HEAD>
    <BODY>
    <P>This is a paragraph <BR /></P>
    </BODY>
    </HTML>
    • Some elements do not require a closing tag, such as the single-line break element.

    V. Attributes

    A. HTML Attributes
    • Attributes provide additional information about an element or a tag, while modifying
    them.
    • Most attributes have a value that modifies the attribute:

    02 Handout 1 *Property of STI


     courseware.feedback@sti.edu Page 2 of 3
    SH1802

    <P ALIGN="center">
    This text is aligned to center
    </P>

    B. Attribute Measurements
    • Some attributes are flexible enough to use different types of values, such as fixed values
    and percentage values.
    • For example, using a fixed value for the width attribute will only have a non-adjustable
    width:
    <HR WIDTH="50px" />
    • Using a percentage value will allow the width to adjust according to any related value
    (such as parent element width):
    <HR WIDTH="50%" />

    C. The Align Attribute


    • The align attribute is used to specify how the text is aligned (left, right, center, or
    justified):
    <HTML>
    <HEAD>
    <TITLE>Attributes</TITLE>
    </HEAD>
    <BODY>
    <P ALIGN="center">This is a text <BR />
    <HR WIDTH="10%" ALIGN="right" /> This is also a text.
    </P>
    </BODY>
    </HTML>
    • Some element attributes are relative to their parent elements; no two (2) similar attributes
    can be used in a single element, or they will be attached to the nearest element that can
    take their value.

    Reference:
    SoloLearn.com – HTML. Retrieved on May 07, 2018 at
    https://www.sololearn.com/Play/HTML/
    w3schools.com – HTML. Retrieved on May 09, 2018 at
    https://www.w3schools.com/html/default.asp

    02 Handout 1 *Property of STI


     courseware.feedback@sti.edu Page 3 of 3

    You might also like