Mga Pahina

Linggo, Enero 23, 2011

Tables and Frames


The table elements allows the user to present tets. Images and other details in a tabular form with customized rows, columns and other formatting styles. Tables are very useful layout tools. Syntax is shown below.

<table align=”center”
background = “URL”
bgcolor= “color name / value ”
border = “integer pixels”
bordercolor = “color name / value”
cellpadding = “integer pixels”
cellspacing = “integer pixels”
cols = “number”
width = “percentage / integer pixels”>
</table>

This code tag below:

<table border=”2”>
<caption> Countries and Capitals</caption>
<tr><th>Country</th>
<th>Capital</th></tr>
<tr><td>Philippines</td>
<td>Manila</td></tr>
<tr><td>USA</td>
<td>Washington D.C.</td></tr>
<tr><td>Malaysia</td>
<td>Kuala Lumpur</td></tr>
<tr><td>Japan</td>
<td>tokyo</td></tr>
<tr><td>Thailand</td>
<td>Bangkok</td></tr>

In a frames environment , a single web page maybe divided to several frames and place different content at each frame. In this element it is possible to work with one frame and alter contents to do other things without affecting the web page. Frames require more than one file.

Sample code:
main_frame.htm

<html>
<head>
<title>Frames example</title>
</head>
<body>
<frameset cols = “200, *”>
<frame src = “one.htm” name=”menu”>
<frame src = “two.htm” name=”menu”>
</frameset>
</html>

Then the frames 2 as one.htm

<html>
<head>
<title>Menu</title>
</head>
<body>
<h1>Menu</h1>
<hr>
<ul><b>My Favorite Websites</b>
<li>
<a href= “http://www.friendster.com”>Friendster</a></li>
<li>
<a href= “http://www.google.com”>Google</a></li>
<li>
<a href= “http://www.yahoo.com”>Yahoo</a></li>
</u>
<hr>
</body>
</htm>

Then the third frames as two.htm


<html>
<head>
<title>Display</title>
</head>
<body>
<body><h1>Display</h1>
</body>
</html>
You may view the result iof you are connected to the internet or may be double click the file.

Walang komento:

Mag-post ng isang Komento