Shadow in website design is something that can be achieved by using CSS and images, to achieve shadow in CSS2 you would use images and positioning, it can be achieved but it usually means that you have to create multiple divs. See my tutorial of creating shadow in CSS2 but one of the exciting new attributes in CSS3 is box-shadow which allows someone to get a nice shadow effect with just using one attribute applied to a div.
Since it's been snowing in Nottingham today and I've come down with a cold, I've been staying indoors, Although during College, all of us have been playing in the snow (Don't judge, we're all still young at heart!) but I've been playing around with the rounded corners effect in CSS3, now in my article Getting ready for CSS3 I listed a few major additions that CSS3 will bring to the web, I mentioned Shadows, multiple backgrounds and some more, but another great addition in CSS3 will be rounded corners, and fortunately there is support for rounded corners, so I thought I'd prepare a little information/tutorial on rounded corners in CSS3!
Although the W3 (World Wide Web Consortium) have sent out CSS3 (New version of the CSS language) to various browser company's such as Mozilla and Safari. Support for it is not high enough, so some of the great attributes that CSS3 will be bringing in such as box-shadow which allows you to add shadow (that we will be creating in this tutorial) with one attribute. So we're going to have stick to CSS2! Creating shadow in CSS2 is a question that's pretty popular amongst the web-dev community as there's no straight attribute to create it, instead to create it one method you can use is a transparent .png image along with one special div defined before any other content/divs on your webpage.
Recent Comments/Trackbacks