Scribd Logo
Upload

Welcome to Scribd!

  • Writing HTML Document

    Uploaded by

    Imaya Senuri
    20 views14 pages
    HTML documents must contain certain required parts, including an optional byte order mark, DOCTYPE, and html element. Documents have a tree structure where elements can be parents, children, or siblings based on their position. Attributes provide additional information about elements and must follow specific syntax rules. Comments and whitespace are also structured elements within HTML documents.

    Original Description:

    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
    HTML documents must contain certain required parts, including an optional byte order mark, DOCTYPE, and html element. Documents have a tree structure where elements can be parents, children, or siblings based on their position. Attributes provide additional information about elements and must follow specific syntax rules. Comments and whitespace are also structured elements within HTML documents.

    Copyright:

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

    Writing HTML Document

    Uploaded by

    Imaya Senuri
    HTML documents must contain certain required parts, including an optional byte order mark, DOCTYPE, and html element. Documents have a tree structure where elements can be parents, children, or siblings based on their position. Attributes provide additional information about elements and must follow specific syntax rules. Comments and whitespace are also structured elements within HTML documents.

    Copyright:

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

    Writing HTML documents

    Documents must consist of the


    following parts, in the given order:

    1. Optionally, a single U+FEFF BYTE ORDER MARK (BOM) character.


    2. Any number of comments and ASCII whitespace.
    3. A DOCTYPE.
    4. Any number of comments and ASCII whitespace.
    5. The document element, in the form of an html element.
    6. Any number of comments and ASCII whitespace.
    ASCII whitespace
    • SPACE
    • CHARACTER TABULATION (tab)
    • LINE FEED (LF)
    Linefeed means to advance downward to the next line; however, it has been
    repurposed and renamed. Used as "newline", it terminates lines (commonly confused
    with separating lines).
    • FORM FEED (FF)
    Form feed means advance downward to the next "page". It was commonly used as
    page separators, but now is also used as section separators.
    • CARRIAGE RETURN (CR)
    Carriage return means to return to the beginning of the current line without
    advancing downward.
    Void Elements

    • Void elements can't have any contents (since there's no end tag, no content
    can be put between the start tag and the end tag).
    The DOCTYPE

    A DOCTYPE is a required preamble


    1.A DOCTYPE must consist of the following components, in this order:
    2.A string that is an ASCII case-insensitive match for the string "<!DOCTYPE".
    3.One or more ASCII whitespace.
    4.A string that is an ASCII case-insensitive match for the string "html".
    5.Optionally, a DOCTYPE legacy string.
    6.Zero or more ASCII whitespace.
    7.A GREATER-THAN SIGN character (>).
    .

    Note: <!DOCTYPE html>, case-insensitively.


    Elements
    There are six different kinds of elements
    1.Void elements
    area, base, br, col, embed, hr, img, input, link, meta, source, track, wbr
    2.The template element
    template
    3.Raw text elements
    script, style
    4.Escapable raw text elements
    textarea, title
    5.Foreign elements
    Elements from the MathML namespace and the SVG namespace.
    6.Normal elements
    All other allowed HTML elements are normal elements.
    Start tags
    Start tags must have the following format
    1. The first character of a start tag must be a LESS-THAN SIGN character (<).
    2. The next few characters of a start tag must be the element's tag name.
    3. If there are to be any attributes in the next step, there must first be one or more ASCII whitespace.
    4. Then, the start tag may have a number of attributes, the syntax for which is described below.
    Attributes must be separated from each other by one or more ASCII whitespace.
    5. After the attributes, or after the tag name if there are no attributes, there may be one or more
    ASCII whitespace. (Some attributes are required to be followed by a space. See the attributes
    section below.)
    6. Then, if the element is one of the void elements, or if the element is a foreign element, then there
    may be a single SOLIDUS character (/), which on foreign elements marks the start tag as self-
    closing. On void elements, it does not mark the start tag as self-closing but instead is unnecessary
    and has no effect of any kind. For such void elements, it should be used only with caution —
    especially since, if directly preceded by an unquoted attribute value, it becomes part of the
    attribute value rather than being discarded by the parser.
    7. Finally, start tags must be closed by a GREATER-THAN SIGN character (>).
    End tags

    End tags must have the following format:

    1. The first character of an end tag must be a LESS-THAN SIGN character (<).
    2. The second character of an end tag must be a SOLIDUS character (/).
    3. The next few characters of an end tag must be the element's tag name.
    4. After the tag name, there may be one or more ASCII whitespace.
    5. Finally, end tags must be closed by a GREATER-THAN SIGN character (>).
    Attributes

    • Attributes for an element are expressed inside the element's start tag.
    • Attributes have a name and a value. Attribute names must consist of one or
    more characters other than controls, SPACE, ("), ('),(>), (/), (=), and
    noncharacters. In the HTML syntax, attribute names, even those for foreign
    elements, may be written with any mix of ASCII lower and ASCII upper
    alphas.
    • Attributes can be specified in four different ways:
    • Empty attribute syntax
    Just the attribute name. The value is implicitly the empty string.
    • Unquoted attribute value syntax
    The attribute name, followed by zero or more ASCII whitespace, followed by a single EQUALS
    SIGN character, followed by zero or more ASCII whitespace, followed by the attribute value, which, in
    addition to the requirements given above for attribute values, must not contain any literal ASCII
    whitespace, any QUOTATION MARK characters ("), APOSTROPHE characters ('), EQUALS SIGN
    characters (=), LESS-THAN SIGN characters (<), GREATER-THAN SIGN characters (>), or GRAVE
    ACCENT characters (`), and must not be the empty string
    • Single-quoted attribute value syntax
    The attribute name, followed by zero or more ASCII whitespace, followed by a single EQUALS SIGN
    character, followed by zero or more ASCII whitespace, followed by a single APOSTROPHE character
    ('), followed by the attribute value, which, in addition to the requirements given above for attribute
    values, must not contain any literal APOSTROPHE characters ('), and finally followed by a second
    single APOSTROPHE character (').
    • Double-quoted attribute value syntax
    The attribute name, followed by zero or more ASCII whitespace, followed by a single EQUALS SIGN
    character, followed by zero or more ASCII whitespace, followed by a single QUOTATION MARK
    character ("), followed by the attribute value, which, in addition to the requirements given above for
    attribute values, must not contain any literal QUOTATION MARK characters ("), and finally followed by
    a second single QUOTATION MARK character (").
    Comments

    Comments must have the following format:


    1. The string "<!--".
    2. Optionally, text, with the additional restriction that the text
    must not start with the string ">", nor start with the string "-
    >", nor contain the strings "<!--", "-->", or "--!>", nor end with
    the string "<!-".
    3. The string "-->".
    The HTML Document Tree
    <body>

    <div id="content">
    <h1>Heading here</h1>
    <p>Lorem ipsum dolor sit amet.</p>
    <p>Lorem ipsum dolor <em>sit</em> amet.</p>
    <hr>
    </div>

    <div id="nav">
    <ul>
    <li>item 1</li>
    <li>item 2</li>
    <li>item 3</li>
    </ul>
    • A diagram of the this HTML document tree would look like this.
    </div>

    </body>
    Parent and Child

    • A parent is an element that is directly above and connected to an element in the document tree. In the diagram
    below, the <div> is a parent to the <ul>.

    • A child is an element that is directly below and connected to an element in the document tree. In the diagram
    above, the <ul> is a child to the <div>.
    Sibling
    • A sibling is an element that shares the same parent with another element.
    • In the diagram below, the <li>'s are siblings as they all share the same parent - the <ul>.

    You might also like