Hiding column : td « Tags « HTML / CSS






  1. HTML / CSS
  2. Tags
  3. td

Hiding column

    

<!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></title>
<style type="text/css" media="Screen">

#t1 * .c3 {
  visibility: hidden;
} 
</style>
</head>
<body>

<table id="t1"> 
    
    <tbody class="b1"> 
        <tr class="r1"> 
            <td class="c1">r1 c1</td> 
            <td class="c2">2</td> 
            <td class="c3">r1 c3</td> 
            <td class="c4">4</td> 
        </tr> 
        
        <tr class="r2"> 
            <td class="c1">r2 c1</td> 
            <td class="c2">2</td> 
            <td class="c3">r2 c3</td> 
            <td class="c4">4</td> 
        </tr>
    </tbody> 
    
    <tbody class="b2"> 
        <tr class="r3"> 
            <td class="c1">r3 c1</td> 
            <td class="c2">2</td> 
            <td class="c3">r3 c3</td> 
            <td class="c4">4</td> 
        </tr> 
        <tr class="r4"> 
            <td class="c1">r4 c1</td> 
            <td class="c2">2</td> 
            <td class="c3">r4 c3</td> 
            <td class="c4">4</td> 
        </tr>
    </tbody> 
    
    <tbody class="b3"> 
        <tr class="r5"> 
            <td class="c1">r5 c1</td> 
            <td class="c2">2</td> 
            <td class="c3">r5 c3</td> 
            <td class="c4">4</td> 
        </tr>
    </tbody> 
</table> 
</body>
</html>








Related examples in the same category

1.'td' Example
2.'choff' is a decimal number specifying an offset from the beginning of the table cell
3.'headers' specifies a list of 'th' elements
4.tr and td
5.Line break in a table cell
6.use table cell as block
7.Hide empty cell
8.Empty table header cell
9.Table cell hover
10.Right-offset Shrinkwrapped Table
11.Table with Spanned Rows and Cells
12.Boxed Table and Cells
13.td font-weight: bold;
14.table cell hover with class
15.td:empty
16.table cell overflow hidden
17.Selecting cells in body
18.Set style for an anchor in table cell
19.Set style for image in a table cell
20.Table cell with different class
21.Table cell with line height setting
22.Add different cell space
23.empty-cells: hide
24.td width:6em;
25.td overflow: hidden;
26.td font-size: 130%;
27.td color: #303030;
28.td font-size: 0.9em;
29.td line-height:1.5; line-height:1.5em; line-height:75%;}
30.Table with column span 2
31.Table with number column
32.css is for the table layout
33.rowspans and colspans merge the specified number of cells vertically or horizontally
34.Selecting cells in column
35.Column widths
36.col width: 200px;
37.col color: crimson;
38.Column highlight