|
|
Posted by Jukka K. Korpela on 11/23/16 11:49
Dung Ping <dungping5@yahoo.com> scripsit:
> A table consists of five rows and five columns. I wanted to put a
> different color on the background of last two columns. I can use <td
> class='dif_color'> on all the cells of those two columns, and define
> the background-color on the <style> section.
>
> But is there a simpler method to group those cells?
Yes. It's not very simple, but at least it does not require all those class
attributes and it works on almost all graphic browsers used these days:
Insert the markup
<col><col><col><col class="special"><col class="special">
into the table, after the <table> tag.
Include the following CSS code into your style sheet:
td:first-child + td + td + td,
td:first-child + td + td + td + td,
..special {
background: #ffc;
color: black; }
The somewhat complicated contextual selectors work on browsers that conform
to the CSS 2 specification, and they select <td> cells in the 4th and 5th
column.
The attribute selector .special, together with the <col> markup, handles IE
6. Whether it _should_ work is mostly just a theoretical question. The
practical side of the matter is that IE 6 uses the background for the
column. (Naturally this postulates that the <td> cells themselves have the
default background, transparent.)
--
Yucca, http://www.cs.tut.fi/~jkorpela/
Navigation:
[Reply to this message]
|