Example simple

From WHATWG Wiki

Jump to: navigation, search
Main article: HTML5 tutorial

This tutorial is aimed at a person using a desktop or laptop computer with a basic text editor. The examples below should be saved to a file with the extension .html. This will help your operating system know that the file is one that should be opened and interpreted by a web browser.

Contents

Step 1: The Basics of an HTML5 Document

A basic HTML5 document consists of a DOCTYPE, HTML tag, HEAD tag with TITLE tag and a BODY tag; this is the basis for all HTML5 documents. Tags are... A comment is... The DOCTYPE is an exception... included because... 


<!DOCTYPE HTML>
<HTML>
  <HEAD>
    <TITLE>Lost Cat!</TITLE>
  </HEAD>
  <BODY>

<!-- Page content -->

  </BODY>
</HTML>

How This Looks

Opening this page in a web browser would produce a blank page with a title in the browser window "Lost Cat!". (link to example)

Step 2: Adding a Heading and Paragraph 


<!DOCTYPE HTML>
<HTML>
  <HEAD>
    <TITLE>Lost Cat!</TITLE>
  </HEAD>
  <BODY>
    <H1>Have You Seen This Cat?</H1>
    <P>Moggy has been missing since 12th June, 2007 if you see her please
     notify <A href="mailto:ian@whatwg.org">Ian Hickson</A>.</P>
  </BODY>
</HTML>

Step 3: Adding an Image 


<!DOCTYPE HTML>
<HTML>
  <HEAD>
    <TITLE>Lost Cat!</TITLE>
  </HEAD>
  <BODY>
    <H1>Have You Seen This Cat?</H1>
    <!-- need to get an image of a cat -->
    <P><IMG src="" alt="The cat is black with white paws, and is wearing a
     white collar with a small bell attached."></P>
    <P>Moggy has been missing since 12th June, 2007 if you see her please
     notify <A href="mailto:ian@whatwg.org">Ian Hickson</A>.</P>
  </BODY>
</HTML>
Retrieved from "http://wiki.whatwg.org/wiki/Example_simple"
Personal tools