hi guys please help me with this issue

1 answer

Sisira 95
1
point
This was chosen as the best answer

You can achieve this by incorporating the embedded style and the piece of jquery code snippet at the bottom of the following markup.

 <!DOCTYPE html>
    <html>
    <head>
    <style>
    body {
    background-color:#FFF;
    color:#000;
    font:75% Verdana,Helvetica,Arial,sans-serif;
    margin:5px;
    padding:0;
    }
    .alt {
        background: #efefef;
    }
    table {
        border-collapse: collapse;
        border-spacing:0;
    }
    td, th {
        border: 1px solid #d2d2d2;
        min-width: 4em;
        padding:5px;
    }
    </style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
    </head>
    <body>
    <table id="test">
      <colgroup>
      <col />
      <col />
      <col />
      <col />
      <col />
      </colgroup>
      <tr>
        <th scope="col">Heading1</th>
        <th scope="col">Heading2</th>
        <th scope="col">Heading3</th>
        <th scope="col">Heading4</th>
        <th scope="col">Heading5</th>
      </tr>  
      <tr>
        <td>Content1</td>
        <td>Content2</td>
        <td>Content3</td>
        <td>Content4</td>
        <td>Content5</td>
      </tr>
      <tr>
        <td>Content1</td>
        <td>Content2</td>
        <td>Content3</td>
        <td>Content4</td>
        <td>Content5</td>
      </tr>
      <tr>
        <td>Content1</td>
        <td>Content2</td>
        <td>Content3</td>
        <td>Content4</td>
        <td>Content5</td>
      </tr>
      <tr>
        <td>Content1</td>
        <td>Content2</td>
        <td>Content3</td>
        <td>Content4</td>
        <td>Content5</td>
      </tr>
    </table>
    <script>
    $(function(){
       $("#test col:odd").addClass("alt");
    });
    </script>
    </body>
    </html>
Answered almost 6 years ago by Sisira
  • its is good its working too. ambika almost 6 years ago