Seasonal CSS
I enjoyed this idea by John Leschinski over on Blogging Tips on how to use a little PHP and CSS to make “seasonal CSS“. You simply spit out the date right inside the class name of the body tag:
<BODY class=”date<?php echo date(“md”); ?>”>
Then you can write CSS like:
.date1225 { background: url(images/christmastrees.png); }
Instead of having PHP spit out the date, you could use it to spit out a random number as well, which you could use to apply different random styles to different elements of your page on load. You know, if you were crazy like that.
Change hover image WITHOUT using background-image
Markus Bertling wrote up a technique I found interesting on how you could create image rollovers without using the CSS property background-imge. Just regular ol’ <img> tags. It makes use of a CSS-Sprite-Like technique of making the image wider than it needs to be, then shifting it back and forth with margin and hiding the overflow. So you do need a browser that handles overflow correctly…
Hidden Accessibility Message
David Walsh has another awesome quick tip on including a hidden accessibility message on your webpages. Just a quick note explaining how you want to provide the best experience possible on this website and contact information in case they have any problems. Then just kick it off the screen with a huge text-indent ala CSS Image Replacement.
this is definitely a good trick
Thats pretty cool.
You never realize this stuff until someone says it, then it makes perfect sense.
The Seasonal CSS is pure fantastic. It wouldn’t have cross my mind that you can do this thing; i will surely start puting this in practive ;)