CSS Help

**dreamcatcher** · Nov 5 '06, 04:01 PM

Originally posted by Pranati

Hi,
I need a help for You.
i want to apply different color for every rows and how can i do that in CSS.
please help me and provide me code for that.

below i have mention the code of my HTML Page.

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Projec t</title>

<style type="text/css">
h1 {color: #993300}
p {color: #797373; font-family: Verdana ;font-size: 12px;}
</style>
<table width="700">
<h1>Project</h1>

</head>

<body>

<form name="input" action="html_fo rm_action.asp"
method="post">

<tr>
<td width="181"><p> Title 1</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Title 2</p></td>
<td><input type="text" name="user0"></td>
</tr>
<tr>
<td width="181"><p> Project Name</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Client Name</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Role Played</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Duration</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Technology</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p> Project Description</p></td>
<td><textarea name="user"></textarea></td>
</tr>

<tr>
<td width="181"></td>
<td><input type="button" value="Submit"> </td>
</tr>

</form>
</table>
</body>
</html>

Here you go, use style in either the td or the tr.

Code:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Project</title>
<style type="text/css">
h1 {color: #993300}
p {color: #797373; font-family: Verdana ;font-size: 12px;}
.red {
	background: #FF0000;
}
.green {
	background: #009900;
}
.blue {
	background: #003399;
}
</style>
<table width="700">
<h1>Project</h1>

</head>

<body>

<form name="input" action="html_form_action.asp"
method="post">

<tr>
      <td width="181" class="red">
<p>Title 1</p></td>
      <td class="red">
<input type="text" name="user0"></td>
</tr>

    <tr class="green"> 
      <td width="181"><p>Title 2</p></td>
<td><input type="text" name="user0"></td>
</tr>
    <tr class="blue"> 
      <td width="181"><p>Project Name</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p>Client Name</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p>Role Played</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p>Duration</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p>Technology</p></td>
<td><input type="text" name="user0"></td>
</tr>

<tr>
<td width="181"><p>Project Description</p></td>
<td><textarea name="user"></textarea></td>
</tr>


<tr>
<td width="181"></td>
<td><input type="button" value="Submit"></td>
</tr>

</form>
</table>
</body>
</html>

CSS Help

CSS Help

Comment