Sunday, December 25, 2011

Web design Example


Example 1:  Background change of the cell

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>backgound change of the cell</title>

<style type="text/css">
.tditem {
font-size: 15px;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
color: #333333;
}
</style>
</head>

<body>
<center>
<h3>Backgound change of the cell</h3>
<table border=0 cellpadding=0 cellspacing=0>
<tr>
<td onmouseover="bgColor='blue'" onClick="window.location='page1.html'" style="cursor:hand" onmouseout="bgColor='#FFFFFF'" bgcolor="#FFFFFF" width="200" align="center" valign="center"><b><font color="#D5D5D5">
<a href="page1.html" class="tditem">
Item 1</a></font></b></td>

<td width="1" align="center">|</td>

<td onmouseover="bgColor='green'" onClick="window.location='page2.html'" style="cursor:hand" onmouseout="bgColor='#FFFFFF'" bgcolor="#FFFFFF" width="200" align="center" valign="center"><b><font color="#D5D5D5">
<a href="page2.html" class="tditem">
Item 2</a></font></b></td>

<td width="1" align="center">|</td>

<td onmouseover="bgColor='red'" onClick="window.location='page3.html'" style="cursor:hand" onmouseout="bgColor='#FFFFFF'" bgcolor="#FFFFFF" width="200" align="center" valign="center"><b><font color="#D5D5D5">
<a href="page3.html" class="tditem">
Item 3</a></font></b></td>

</tr>
</table>
</center>



</body>
</html>

No comments:

Post a Comment