Change text color in <td></td>

Report · Sep 21, 2009

Guys i have a table and i want to change the text color within certain cells, I know i can easile change the background color, and i am also aware i can wrap the text in a header tag <h1>text<.h1>, but is there another way to get this like <td> text color="#ff9933" my text</td>

Report · Sep 21, 2009

Something like this: The following will style all the text in a cell either orange or blue. You can go even further and add the colour to a <p> tag inside the cell if you need to.

<!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>Untitled Document</title>
<style type="text/css">
#maintable {width: 800px; margin: 0 auto;}

 #maintable td.orange {color: #ff9933;}
 #maintable td.blue {color:#00F;}

</style>
</head>
<body>
<table width="800" border="0" cellpadding="0" cellspacing="0" id="maintable">
  <tr>
    <td class="orange">THIS IS SOME TEXT COLOURED ORANGE</td>
  </tr>
  <tr>
    <td class="blue">THIS IS SOME TEXT COLOURED BLUE</td>
  </tr>
</table>
</body>
</html>

Report · Sep 21, 2009

And one more example:

<!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>Untitled Document</title>
<style type="text/css">
#maintable {
     width: 800px;
     margin: 0 auto;
}

#maintable td.orange {
     color: #ff9933;
}

#maintable td.blue {
     color:#00F;
}

#maintable p.red {
     color: red;
}
</style>
</head>
<body>
<table width="800" border="0" cellpadding="0" cellspacing="0" id="maintable">
  <tr>
    <td valign="top" class="orange"><p>THIS IS SOME TEXT COLOURED RED</p>
      <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus. Aenean viverra malesuada libero. Fusce ac quam. Donec neque. Nunc venenatis enim nec.</p></td>
  </tr>
  <tr>
    <td class="blue"><p>THIS IS SOME TEXT COLOURED BLUE</p>
      <p class="red">This paragraph is red, consectetuer adipiscing elit. Duis ligula lorem, consequat eget, tristique nec, auctor quis, purus. Vivamus ut sem. Fusce aliquam nunc vitae purus</p></td>
  </tr>
  <tr>
    <td class="blue"> </td>
  </tr>
</table>
</body>
</html>

Change text color in <td></td>

1 Correct answer