th background: #e7e6e6 url(MarketPlace-images/button.jpg) repeat-x; : th background « Tags « HTML / CSS






th background: #e7e6e6 url(MarketPlace-images/button.jpg) repeat-x;

    

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>

<meta name="Description" content="Information architecture, Web Design, Web Standards." />
<meta name="Keywords" content="your, keywords" />
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<meta name="Distribution" content="Global" />
<meta name="Author" content="Erwin Aligam - ealigam@gmail.com" />
<meta name="Robots" content="index,follow" />

<style type='text/css'>
/* start - table */
table {
  border-collapse: collapse;
  margin: 10px;  
}
th strong {
  color: #fff;
}
th {
  background: #e7e6e6 url(MarketPlace-images/button.jpg) repeat-x;
  height: 29px;
  padding-left: 12px;
  padding-right: 12px;  
  text-align: left;
  border-left: 1px solid #f4f4f4;
  border-bottom: solid 2px #fff;
  color: #333;
}
tr {
  height: 30px;
}
td {
  padding-left: 11px;
  padding-right: 11px;
  border-left: 1px solid #fff;
  border-bottom: 1px solid #fff;
}
td.first,th.first {
  border-left: 0px;
}
tr.row-a {
  background: #F8F8F8;
}
tr.row-b {
  background: #EFEFEF;    
}
/* end - table */

</style>



<title>Marketplace</title>

</head>

<body>

<!-- wrap starts here -->
<div id="wrap">
      <h3>Table Styling</h3>              
      <table>
        <tr>
          <th class="first">post date</th>
          <th>title</th>
          <th>description</th>
        </tr>
        <tr class="row-a">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Augue non nibh</a></td>
          <td><a href="index.html">Lobortis commodo metus vestibulum</a></td>
        </tr>
        <tr class="row-b">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Fusce ut diam bibendum</a></td>
          <td><a href="index.html">Purus in eget odio in sapien</a></td>
        </tr>
        <tr class="row-a">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Maecenas et ipsum</a></td>
          <td><a href="index.html">Adipiscing blandit quisque eros</a></td>
        </tr>
        <tr class="row-b">
          <td class="first">04.18.2007</td>
          <td><a href="index.html">Sed vestibulum blandit</a></td>
          <td><a href="index.html">Cras lobortis commodo metus lorem</a></td>
        </tr>
      </table>

</div>

</body>
</html>
  

   
    
    
    
  








Related examples in the same category

1.th background-color: gold;
2.Add background for table header
3.Add background image for table header
4.Add different background images for each table column header
5.Background for table header row
6.table header background-color: #cccccc;
7.th background: #882D2D;
8.th background: #F3F3F3;
9.th background-color:#d6d6d6;
10.th background-color: #CDC1A7;
11.th background: lightsteelblue;