Scribd
Upload
76 views

4 HTML Part I

This document provides an overview of HTML and its basic structure. It discusses: 1) The global structure of an HTML document includes the HTML, HEAD and BODY sections. 2) The HEAD section contains metadata and title, while the BODY contains visible content. 3) HTML uses block elements like headings, paragraphs and lists to structure content, and inline elements like bold, italics to format text. 4) Examples demonstrate using basic HTML elements and tags.

Uploaded by

ag4a
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
76 views

4 HTML Part I

This document provides an overview of HTML and its basic structure. It discusses: 1) The global structure of an HTML document includes the HTML, HEAD and BODY sections. 2) The HEAD section contains metadata and title, while the BODY contains visible content. 3) HTML uses block elements like headings, paragraphs and lists to structure content, and inline elements like bold, italics to format text. 4) Examples demonstrate using basic HTML elements and tags.

Uploaded by

ag4a
Copyright
© Attribution Non-Commercial (BY-NC)
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

University of Guyana • Faculty of Natural Sciences • University of Guyana • Faculty of Natural Sciences •

Department of Computer Science Department of Computer Science

CSI225 Internet Computing (lecture 4) Below is an example of a simple HTML document:


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
HTML Part I – The Basics "http://www.w3.org/TR/html4/strict.dtd">
<HTML>
<HEAD>
Overview <TITLE>My first HTML document</TITLE>
Previously you’ve learnt that HTML is a markup language that </HEAD>
defines the format of data presented in web interfaces (that are <BODY>
<P>Hello world!</P>
rendered and displayed in the browser). You also learnt that HTML </BODY>
uses pre-defined elements to specify the format of the entities that </HTML>
make up the web interface and these elements are further controlled
by associated attributes. Every HTML document resembles the global structure shown with
variances in content of the <HEAD> and <BODY> sections.
This lecture establishes a foundation of working with HTML. The
principles of working with the language will be covered followed by The <HTML> element denotes the root of the HTML document.
select (commonly used) portions of its specification. It is expected,
however, that you will supplement your HTML knowledge as needed. The <HEAD> element contains information about the current document
such as its title and keywords that may be useful to search engines
and other data that are not considered document content. User agents
do not usually render elements contained in the <HEAD> they may,
The Global Structure of an HTML document however, make information in the <HEAD> available to users through
An HTML 4.0 document is composed of three parts: other mechanisms. Some examples of elements that may appear in the
<HEAD> element are:
1. A line containing HTML version information (optional) • <META> - Used to specify properties of a document (e.g.
2. A declarative headers section (delimited by the <HEAD> author, expiration date, keywords, etc.) and assign values to
element) those properties.
3. A body, which contains the document’s actual content. The • <LINK> - Used to indicate a relationship between the
body may be implemented by the <BODY> element or the document and other documents or objects. More commonly
<FRAMESET> element. the <LINK> element is used to reference external CSS files
using the format: <LINK href=”path-to-css”
Additionally, sections 2 and 3 are delimited by the <HTML> element. REL=”stylesheet”>

Page 1 E Marks 2/14/2007 Page 2 E Marks 2/14/2007


University of Guyana • Faculty of Natural Sciences • University of Guyana • Faculty of Natural Sciences •
Department of Computer Science Department of Computer Science

Every HTML document must have a <TITLE> element in the <HEAD> <IMG> - Inline image
section. The <TITLE> element is used to identify the contents of a <SPAN> - Generis inline character
web document. User agents usually make the content in the <TITLE> <INPUT> - Form input element
element visible to users, for instance in Internet Explorer, the title of a
web document shows up in the title bar of the browser window. Additionally there are elements that may be used as block elements as
well as inline elements. These are:
The <BODY> element contains the web document’s content. The <APPLET> - To embed a Java Applet
content may be represented by a user agent in a variety of ways. For <IFRAME> - Inline Frame
instance, various (visual) web browsers interpret and render the <MAP> - Image map
HTML markup within the <BODY> with variations. It is therefore <SCRIPT> - Client side script
important to cater for cross browser compatibility when developing
web interfaces. With this established, we now look at these elements at work. The
following examples demonstrate the use of the basic HTML elements
Structurally the document content is organised into blocks of text discussed.
such as paragraphs, lists, headings, etc. Generically, the elements that
manage the various types of blocks of text are known as block
elements. These are:
<Hn> - Headings
<P> - Paragraphs
<PRE> - Pre-format
<HR> - Horizontal Rule
<FORM> - To enclose web forms
<TABLE> - To arrange elements in a tabular fashion
<DIV> - For additional alignment

Additionally at the next level down there are inline elements that
usually appear within block elements to further alter the appearance
of text. Some examples of inline elements are:
<EM> - Emphasis also <I>
<STRONG> - Also <B> to bold text
<BIG> - Large text
<SMALL> - Small text
<BR> - line break
<CITE> - citation
<FONT> - Font change

Page 3 E Marks 2/14/2007 Page 4 E Marks 2/14/2007


University of Guyana • Faculty of Natural Sciences • University of Guyana • Faculty of Natural Sciences •
Department of Computer Science Department of Computer Science

And, here is its HTML source:

The following is a screenshot of a web-page as it is displayed in the


web browser (taken from http://www.w3schools.com)

Page 5 E Marks 2/14/2007 Page 6 E Marks 2/14/2007

You might also like