Welcome to Scribd, the world's digital library. Read, publish, and share books and documents. See more
Standard view
Full view
of .
Look up keyword
Like this
0 of .
Results for:
No results containing your search query
P. 1
HTML Basic

HTML Basic

Ratings: (0)|Views: 114|Likes:
Published by api-3745065

More info:

Published by: api-3745065 on Oct 17, 2008
Copyright:Attribution Non-commercial


Read on Scribd mobile: iPhone, iPad and Android.
download as PDF, TXT or read online from Scribd
See more
See less





IEEM 230. HTML Basics
Objectives of the lab:
Learn how the web works
- The client-server model

Learn basic HTML language, and be able to write HTML documents using a text editor.
- simple formatting
- lists
- controlled layouts using tables
- images
- links and URL\u2019s

HTML = HyperText Markup Language
Simple HTML documents contain two things: (1) the text, and (2) information about how the text
should be formatted (calledTAG\u2019s).
The TAG\u2019s provided in the following HTML example file will be sufficient for the purpose of
this lab. To make it easier to read, all TAG\u2019s are red, and comments are in blue.
------- Simple example of HTML ---
<!-- this is a comment. Each HTML file begins with an \u201chtml\u201d tag, and ends with a \u201c/html\u201d tag>
<!-- html documents have two sections: \u201chead\u201d and \u201cbody\u201d>

<title> IEEM 230: basic html tags

<!\u2014title is what appears on the title bar of the window >

<b> IEEM 230 Lab 1: Simple HTML reference </b>
<b> <i> Simple formatting tags </i> </b>

<!-- the \u201cb\u201d and \u201c/b\u201d tags enclose bold face text >
<!-- the \u201ci\u201d and \u201c/i\u201d tags enclose text in italics >
<!-- the \u201cbr\u201d tag causes a line break (the following text is printed on a new line)>
<!-- the \u201cp\u201d and \u201c/p\u201d tags enclose each paragraph>
<font size=+1 color=red> The \u201cfont\u201d tag </font> can control the size and color of text. It has
two useful options: size=+N (N is an integer) will increase or decrease the size of text to the N-th

larger font size; size=-N will decrease font size. The color=C changes the color of the text. HTML recognizes all common color names, or you can specify the RGB value of the color in Hexadecimal.

<b> <i> Controlling the layout of text in a page </i> </b>
<b> 1. Horizontal bars. </b> To break a page into sections, create a horizontal bar using the

\u201chr\u201d tag.
<b>2. Lists of items. </b> You can create a list of items using the following.
<!-- the \u201col\u201d and \u201c/ol\u201d tags enclose an ordered, or numbered list of items >
<!-- the \u201cli\u201d and \u201c/li\u201d tags enclose each list-item>
<!-- the \u201cul\u201d and \u201c/ul\u201d tags enclose an un-ordered, or bullet list of items >
<!-- \u201cli\u201d and\u201d/li\u201d enclose each list-item>
<!-- below is an example of a numbered list with two items>

<li> First item in an ordered list. </li>
<li> Second item in a ordered list </li>

<!-- below is an example of a bullet list with two items>

<li> One item in an unordered list </li>
<li> Another item in the unordered list </li>

<b>3. Tables. </b>Often you will need to display items in a table. To do so, use a \u201ctable\u201d tag.

Another common use of tables is to divide the entire page into a few segments, with each segment having its own data to display. A table is made of rows, and each row has one or more columns, or cols.

<b>Example of a table:</b> <br>

<table border=1 cellspacing=1>
<td> First col of First row </td>
<td> Second col of First row </td>

<td> First col of Second row </td>
<td> Second col of Second row </td>

</table >
You can experiment with different values for \u201cborder=N\u201d and \u201ccellspacing=N\u201d.

<b> <i> Commonly used links </i> </b>

<li> Link to another document: \u201ca href=URL\u201d Text of the link \u201c/a\u201d <br>
Example: <a href=http://www.ust.hk/itsc/webguide/reference/html-tools.html>
ITSC web-page building guide
<li> Email links: \u201ca href=mailto\u201d text of link \u201c/a\u201d <br>
Example: <a href=mailto:somebody@some.place> Email Some body</a>
<li> Include a picture in a document: \u201cimg src=URL\u201d tag: <br>
Example: <img src=shark.jpg>

The URL,(Universal Resource Locator) is the <b> <i>name and location </b> </i> (on the internet) of the linked file. Its format is: http://computer_name/full_path_name_of_file. The URL of a link is also displayed by the web client, e.g. Internet explorer shows it as the \u201cLocation:\u201d URL can be absolute (e.g. the first item in the list above), or relative to the location of the current file (e.g. the \u201cimg src=shark.jpg\u201d example in the list above).

<!-- Each html file ends with the closing of the \u201cbody\u201d and the \u201chtml\u201d tags.>
The Client-Server Model -- how the web works

The function of the internet requires at least two programs: A web client (e.g. Internet Explorer), and a web server (e.g. Apache, or Microsoft IIS). The server program is always running on a computer which is also called your web-server.

You're Reading a Free Preview

/*********** DO NOT ALTER ANYTHING BELOW THIS LINE ! ************/ var s_code=s.t();if(s_code)document.write(s_code)//-->