Organizing Information

In this tutorial, you will learn how to use table and list tags to organize information. This tutorial contains online editor which you can edit and run the codes to view the results. Try to solve the exercise by editing the codes in the online editor. This tutorial is not meant to be comprehensive. For more information please refer to the slide presentation available on eLearn@USM, reference book or the internet.

Lists

HTML provides two types of lists: unordered lists and ordered lists. Lists are defined with the <ul> (unordered/bullet list) or the <ol> (ordered/numbered list) tag, followed by <li> tags (list items).

Exercise

Create a paragraph containing an unordered/ordered list using the following text.

Computer Science is the study of computers and computational systems. Unlike electrical and computer engineers, computer scientists deal mostly with software and software systems which includes their theory, design, development, and application.


Table

HTML tables allow information to be represented in a table. A table is defined with the <table> tag. Each table row is defined with the <tr> tag. A table header is defined with the <th> tag. By default, table headings are bold and centered. A table data/cell is defined with the <td> tag. The <caption> tag is used to add a caption to a table.

Exercise

Create a table consist of three rows and two columns and tabulate following data.
Universiti Malaya - 1905
Universiti Sains Malaysia - 1969
Universiti - 1970