Sunday, February 10, 2013

How to create a simple table with spearate colours on odd and even rows

This explains on how to style a table with different row colors one after the another.










Create the table using HTML
(If your using div to generate a table you can apply the same for relevant divs as well)
 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
  <table id="box-table-a" summary="Employee Pay Sheet">
    <thead>
      <tr>
        <th scope="col">Employee</th>

        <th scope="col">Salary</th>

        <th scope="col">Bonus</th>

        <th scope="col">Supervisor</th>

        
      </tr>
    </thead>

    <tbody>
      <tr>
        <td>Stephen C. Cox</td>

        <td>$300</td>

        <td>$150</td>

        <td>Bob</td>

        
      </tr>

      <tr>
        <td>..</td>
        
      </tr>
    </tbody>
  </table>


Create a CSS classes as folows
1
2
3
4
5
6
.odd{
  background-color :  #F1F1F1;
}
.even{
  background-color :  #666699;
}


Add Styling using JQuery
JQuery has an attribute to identify odd and even rows in a specified scope. '$('tr:odd')' will check the first odd and then will assign the 'odd' class defined in .addClass('odd').
1
2
3
4
$(document).ready( function(){
 $('tr:odd').addClass('odd');
 $('tr:even').addClass('even');
}

How to Setup SFTP Server Using GCP VM With a Mounted GCP Bucket

SFTP is the secured method of implementing FTP where you can use a server or storage location as FTP location which you can transfer files f...