Paulieboy Posted April 24, 2014 Share Posted April 24, 2014 I have created a calendar for my golf league and wish to color code the days that we play with a specific color and other events different colors. We play on a thursday so I would like to color code all thurdays "green" My question is, what would be the best and most professional way to do this? Would creating an external css file and giving each Thursday the same ID or class name? Would a Class designation be better? Would the following coding example be appropriate? Any help would be greatly appreciated Thank you CSS file: .thursday { bgcolor: green; } HTML file: <td class = "thursday">....... Link to comment Share on other sites More sharing options...
Ingolme Posted April 24, 2014 Share Posted April 24, 2014 Giving the <td> elements a class and using an external stylesheet works well. The CSS rule for background color is background-color, not bgcolor. Link to comment Share on other sites More sharing options...
Paulieboy Posted April 24, 2014 Author Share Posted April 24, 2014 Thanks Foxy Mod. Question: I know that you can create an ID(#Name) and a Class(.Name) can I, or is there a way to give the beginning <td> tag a name of its own for "Thursdays"? Example: CSS file: td.thursday { background-color: "green"; } HTML file: <td thursday........> I'm trying to learn proper coding through experimentation, and asking alot of questions....lol Thanks. Link to comment Share on other sites More sharing options...
Ingolme Posted April 24, 2014 Share Posted April 24, 2014 No, you have to use the class attribute to give a "name" to an element. Link to comment Share on other sites More sharing options...
davej Posted April 25, 2014 Share Posted April 25, 2014 How about... <!DOCTYPE html><html><head><style>td{width:40px;height:40px;border:1px solid #555;text-align:center;}td:nth-child(5){background-color:green;}</style></head><body><table><tr><td>S</td><td>M</td><td>T</td><td>W</td><td>R</td><td>F</td><td>S</td></tr><tr><td>S</td><td>M</td><td>T</td><td>W</td><td>R</td><td>F</td><td>S</td></tr></table><p><b>Note:</b> Internet Explorer 8 and earlier versions do not support the :nth-child() selector.</p></body></html> http://www.w3schools.com/cssref/sel_nth-child.asp Link to comment Share on other sites More sharing options...
Paulieboy Posted May 5, 2014 Author Share Posted May 5, 2014 This :nth-child selector is very interesting. I never seen it before. I think I will need to keep this in mind for futher works...thanks. P Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now