Scribd Logo
Carica

Benvenuto in Scribd!

  • HTML

    Caricato da

    api-3742735
    509 visualizzazioni4 pagine
    HTML documents have three, document-level tags in common. These tags,, and, delimit certain sections of the HTML. And can be omitted if nothing is to be shown.

    Descrizione originale:

    Copyright

    © Attribution Non-Commercial (BY-NC)

    Formati disponibili

    DOC, PDF, TXT o leggi online da Scribd

    Hai trovato utile questo documento?

    Questo contenuto è inappropriato?

    Segnala questo documento
    HTML documents have three, document-level tags in common. These tags,, and, delimit certain sections of the HTML. And can be omitted if nothing is to be shown.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Scarica in formato DOC, PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    509 visualizzazioni4 pagine

    HTML

    Caricato da

    api-3742735
    HTML documents have three, document-level tags in common. These tags,, and, delimit certain sections of the HTML. And can be omitted if nothing is to be shown.

    Copyright:

    Attribution Non-Commercial (BY-NC)
    Scarica in formato DOC, PDF, TXT o leggi online su Scribd
    Segnala contenuti inappropriati
    di 4

    F.

    4 CIT – Basic HTML page 1

    Structure
    All HTML documents have three, document-level tags in common. These tags, <HTML>, <HEAD> and
    <BODY>, delimit certain sections of the HTML. However, <HEAD> and <BODY> can be omitted if
    nothing is to be shown. Note that all HTML tags are case-insensitive.
    <HTML>:
    The <HTML> tag surrounds the entire HTML document. This tag tells the client browser where the
    document begins and ends.
    <HEAD>:
    The <HEAD> tag delimits the heading of the HTML document. This heading section of the
    document is the first part that is loaded into local computer. And this part tells the browser how to
    behave and handle the document. It contains certain heading information for the document, which
    are mostly invisible on the rendered page in the client’s browser. The document’s title, meta
    information (information about the document), and in most cases, document scripts are all
    contained in the <HEAD> section.
    <BODY>:
    The <BODY> tag defines the main, visual content of the HTML document. In the HTML versions
    prior to HTML version 4.0, page properties, including the document background, text and links
    colours, can be defined by specifying the attributes of the <BODY> tag. However, in HTML version
    4.0, most of the attributes of the <BODY> tag have been deprecated, and these options are defined
    by specifying the attributes as styles.
    <HTML>
    <HEAD>
    …Header Information…
    </HEAD>
    <BODY>
    …Document Content…
    </BODY>
    </HTML>
    Figure 1. Basic structure of a HTML document
    <HEAD> Tag
    One can perform the following tasks in the <HEAD> section by defining different elements:
    1. Specifying the document title:
    The title of the document is shown on the title bar in the browser. The document title is
    defined in the <title> tag.
    Usage: <title>Title</title>
    Example:
    <html>
    <head>
    F.4 CIT – Basic HTML page 2

    <title>CIT homepage</title>
    </head>
    <body>
    </body>
    Title of the HTML document
    </html>

    Title bar

    Figure 2. The title of the above example is shown in the browser with the browser name
    2. Providing additional information:
    Information about the document (not the content) can be given to the browser or the search
    engines. These are done by defining <meta> element.
    Usage: <meta attr_name1=”value” attr_name2=”value” ...>
    Example:
    i. Define the content type of the document as HTML with Latin character set (ISO-
    8859-1):
    <meta http-equiv=”Content Type” content=”text/html;
    charset=ISO-8859-1”>
    ii. Tell the browser not to cache (save for further use) the current page:
    <meta http-equiv=”pragma” content=”no-cache”>
    This can also be done by the following:
    <meta http-equiv=”expires” content=”0”>
    iii. Refresh the browser window with Yahoo! after 2 seconds:
    <meta http-equiv=”refresh”
    content=”2;URL=http://www.yahoo.com”>
    Note: Try to avoid using “refresh” because not all browser support this attribute.
    iv. Provides description and keywords to search engines:
    <meta name=”description” content=”F.4 CIT - HTML”>
    <meta name=”keywords” content=”CIT, HTML, Computers”>
    3. Setting the default path:
    The default location for the documents, images or linked files are defined by <base>
    element. It is useful if relative references are used in the documents but the files are mainly
    located in another server.
    Usage: <base href=”base_address”>
    Example:
    Set http://www.twphcymc.edu.hk/ as the base of the documents:
    <base href=”http://www.twphcymc.edu.hk/”>
    F.4 CIT – Basic HTML page 3

    <BODY> Tag
    <BODY> tag can control the following by setting different attributes:
    1. The background of the document:
    Attribute Function
    bgcolor Specifies the background color for the document body.
    background Specifies a URL for an image that will be used to tile the document
    background.
    bgproperties Specifies if the background image (if any) will move when the
    document is being scrolled.

    Possible value: “fixed”


    scroll Specifies if the document can be scrolled.
    Possible values: “yes”/“no”

    2. Text colour:
    Attribute Function
    text Specifies the color used to stroke the document's text.
    link Specifies the color used to stroke the text for unvisited hypertext links.
    vlink Specifies the color used to stroke the text for visited hypertext links.
    alink Specifies the highlight color used to stroke the text for hypertext links at
    the moment the user clicks on the link.
    Example:
    <html>
    <head><title>CIT homepage</title></head>
    <body bgcolor=”#000099” text=”red” link=”#00FF00” alink=”white”
    vlink=”yellow”>
    Hello this is a test.
    <a href=”www.yahoo.com”>Yahoo!</a>
    <a href=”www.twphcymc.edu.hk”>TWPHCYMC Homepage</a>
    </body>
    </html>

    Figure 3a. Resulting page of the above HTML code. (Before visiting any links)

    Figure 3b. Resulting page of the above HTML code. (After visiting Yahoo! The focus is on the link)
    F.4 CIT – Basic HTML page 4

    Figure 3b. Resulting page of the above HTML code. (After visiting Yahoo! The focus is not on the link)
    Note: All colours can be specified by RGB values or colour names
    Color names and RGB values
    Black = "#000000" Green = "#008000"
    Silver = "#C0C0C0" Lime = "#00FF00"
    Gray = "#808080" Olive = "#808000"
    White = "#FFFFFF" Yellow = "#FFFF00"
    Maroon = "#800000" Navy = "#000080"
    Red = "#FF0000" Blue = "#0000FF"
    Purple = "#800080" Teal = "#008080"
    Fuchsia = "#FF00FF" Aqua = "#00FFFF"

    Figure 4. Table showing the name and RGB values (in hexadecimal) of different colours

    Potrebbero piacerti anche