Set table border for table header : th border « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. th border

Set table border for table header

     


<!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" xml:lang="en" lang="en">
<head>
  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
  <title>Chater 3 - Tables are Evil?</title>
  <style type="text/css" media="screen">
  div {
    margin-bottom: 30px;
  }
    
  #divID table {
    border-top: 1px solid #999;
    border-left: 1px solid #999;
  }
  
  #divID th, #divID td {
    border-right: 1px solid #999;
    border-bottom: 1px solid #999;
  }  
  
  </style>
</head>

<body>


<div id="divID">
<table summary="Summary goes here">
  <caption>This is the title of the table</caption>
  <tr>
    <th>Year</th>
    <th>Opponent</th>
    <th>Item 3</th>
  </tr>
  <tr>
    <td>1918</td>
    <td>Item A</td>
    <td>75-51</td>
  </tr>
  <tr>
    <td>1916</td>
    <td>Item B</td>
    <td>91-63</td>
  </tr>
  <tr>
    <td>1915</td>
    <td>Item C</td>
    <td>101-50</td>
  </tr>
  <tr>
    <td>1912</td>
    <td>Item D</td>
    <td>105-47</td>
  </tr>
</table>
</div>

</body>
</html>








Related examples in the same category

1.Set table header border to be 1px solid black, its width to 6em
2.Table header with border
3.th border-left: 1px solid #f4f4f4;
4.th border-bottom: solid 2px #fff;
5.th border-left: 1px solid #EDC9C9;
6.th border-bottom: 1px solid #FFF;
7.th border-left: 1px solid #fff;
8.th border: 1px solid black;
9.th border-bottom-width: 1px;
10.th border-bottom-style: solid;
11.th border-bottom-color: #CDC1A7;
12.th, tfoot td border: thin solid black;text-align: center;font-weight: bold;
13.thead th {border-bottom: 1px solid #333; text-align: center; font-weight: bold;}
14.th[scope="col"] {border-bottom: 1px solid gray;}