CSS Tutorials — Effects

As CSS3 rolls out around the web, it is bringing some interesting new presentational techniques along with it. Today, we’ll review the basics of using CSS3 transitions and animations to add an extra layer of polish.

Usually for inserting text into the inputs or our forms we set the value attribute with the text and then use javascript to check for different scenarios for doing some fancy things. This is different we will use labels to fill the text and move them under the inputs and then just do our magic with JS.

a very cool and step-by-step tutorial on how to make a CSS3 drop shadow changer using Ajax and little bit of PHP/MySQL. You may ask yourself why I’m using PHP/MySQL in a CSS3 tutorial? and the answer is simple, to save the settings and fetch again.

Though CSS3 properties are not yet widely supported, there is no harm in experimenting with what may eventually be the norm. In this tutorial, we style a web form with rounded corners, gradients and a shadow using only CSS.

Sure? Yes, it’s possible to create a simple and nice (3D) layout playing with some CSS3 stuff, only using code and without the help of Photoshop.

Let’s take a look at how to create a cool anaglyphic style text effect for sprucing up your web designs, while taking into consideration semantics and avoiding the repetition of any markup.

Most image captioning solutions in HTML are messy and tough to swap out later. This solution keeps your code clean and upgrades like a dream.

In this post, I will discuss the topic of using text shadow in HTML/CSS. Text shadow is a property from CSS2, and what it does is simply apply shadow to the text. Moreover, text shadow allows you to create a somewhat moved or blurred copy of a piece of text, to do positioned or color shadows...

We are making an Apple-like slideshow gallery with the help of jQuery & CSS, with no PHP or databases required. As a bonus all the source code is freely available for download.

Rounded corners have been included in the CSS3 specification. Here’s how you can use them today in most modern browsers.