Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

WAM100 - Using Cascading Style Sheets
In this step, you will investigate how a specific column can be identified and then create style sheet entry to change the background color for this column only. 1.  Run

  1. Run the WAM iiiUsingCSS to display a list of employees. Using IE Developer Tools select the first input field in the first column (Employee Number).

    Image Modified

...


  1. Note that the <td> tags for each column have a class equal to the field name. In the first column this is EMPNO.

...


  1. Add this code to your style sheet and save the changes:

...

  1.      TABLE#EMPLIST tr.list-

...

  1. o > TD.EMPNO
    {
         background-color:

...

  1.  #d78700;
    }
    TABLE#EMPLIST tr.list-

...

  1. e > TD.EMPNO
    {
         background-color:

...

  1.  #d78700;
    }

    This will override the background color for odd and even rows in table cells with a class of EMPNO.

...


  1. Run your WAM iiiUsingCSS and display a list of employees. Your results should look like the following:

    Image Modified