Scribd Logo
Upload

Welcome to Scribd!

  • Advanced 2 Millan

    Uploaded by

    Ana Enclonar
    43 views13 pages
    html

    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

    Copyright:

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

    Advanced 2 Millan

    Uploaded by

    Ana Enclonar
    html

    Copyright:

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

    Introduction to

    HTML
    What is HTML
    Webpages are written in HTML - a simple scripting language.

    ● HTML stands for Hyper Text Markup Language


    ● Hypertext is simply a piece of text that works as a link.
    ● Markup Language is a way of writing layout information within
    documents.
    ● HTML elements are the building blocks of HTML pages
    ● HTML elements are represented by tags
    ● HTML tags label pieces of content such as "heading",
    "paragraph", "table", and so on
    ● Browsers do not display the HTML tags, but use them to render
    the content of the page

    2
    A Simple HTML Document Example Explained
    <!DOCTYPE html> ● The <!DOCTYPE html> declaration defines this
    <html> document to be HTML5
    <head>
    <title>Page Title</title> ● The <html> element is the root element of an
    </head> HTML page
    <body>
    ● The <head> element contains meta information
    <h1>My First Heading</h1> about the document
    <p>My first paragraph.</p> ● The <title> element specifies a title for the
    </body> document
    </html> ● The <body> element contains the visible page
    content
    ● The <h1> element defines a large heading
    ● The <p> element defines a paragraph

    3
    The <!DOCTYPE> Declaration

    The <!DOCTYPE> declaration represents the document type, and helps


    browsers to display web pages correctly.
    It must only appear once, at the top of the page (before any HTML tags).
    The <!DOCTYPE> declaration is not case sensitive.
    The <!DOCTYPE> declaration for HTML5 is:

    <!DOCTYPE html>

    4
    Web Browsers
    × Google Chrome.
    × Firefox.
    × Safari.
    × UC Browser.
    × Internet Explorer.
    × Opera.

    5
    Versions of HTML

    HTML 1.0 (1989 - 1994)


    HTML 1.0 was very limited in terms of styling and presentation of content. In HTML 1.0, for
    example, you could not:
    ● use tables or frames,
    ● specify fonts,
    ● change page background, or
    ● use forms
    Because of these limitations, every web page created with HTML 1.0 looked the same with similar
    background and the type of font used.
    Notes:
    ● because the World Wide Web Consortium (W3C) did not exist at the time HTML 1.0 first
    appeared, W3C did not formally specify the HTML 1.0 specification.
    ● HTML 1.0 was only supported by Lynx (a non-graphical browser running on UNIX) and
    Mosaic.

    6
    HTML 2.0 (1995)
    Supported more browsers. HTML 2.0 supported:
    × forms with limited set of form elements such as text boxes, and
    option buttons
    × change of page background
    × use of tables

    HTML 3.20 (1997)


    This version included support for creating tables and expanded options for
    form elements.
    × It also allowed web pages to include complex mathematical
    equations. This version of HTML supports many
    presentation-focused elements such as font, as well as early support
    for some scripting features.

    7
    HTML 4.01 (1999)

    HTML 4.01 is the current official standard. This version is very stable,
    having been released in December 1999. This version added support
    for style sheets and scripting ability for multimedia elements.

    8
    HTML 5 (2014)
    VIDEO
    The video element allows you to easily stream video from a website.

    <video width="450px" height="350px" controls>


    <source src="video-url.mp4" type="video/mp4">
    </video>

    FIGURE
    Figure elements can be used to display visual content, such as photos, illustrations,
    diagrams or code snippets.

    <figure class="gallery-item">
    <img src="image-1.png">
    </figure>
    <figure class="gallery-item">
    <img src="image-2.png">
    </figure>
    9
    SECTION NAV
    Section elements, like divs, can The nav element is used for the part of a website
    be used to organize webpage that links to other pages on the site. The links can
    content into thematic groups. be organized a number of ways. Below, the links are
    displayed within paragraph elements. An
    <section
    class="contact-form"> unordered list could also be used.
    <h2>Contact Us</h2>
    <form> <nav>
    ... <p><a href="login.html">Log In</a></p>
    </form> <p><a href="signup.html">Sign Up</a></p>
    </section> <p><a href="contact.html">Contact Us</a></p>
    </nav>

    10
    HTML TAGS
    <TAG> (something) </TAG>

    11
    HTML TAGS
    HTML tags are element names surrounded by angle brackets:

    <tagname>content goes here...</tagname>


    × HTML tags normally come in pairs like <p> and </p>
    × The first tag in a pair is the start tag, the second tag is the end tag
    × The end tag is written like the start tag, but with a forward slash inserted
    before the tag name

    12
    13

    You might also like