Home » CSS 3 » Archive by categorySnippets

CSS3 Transitions – Cross Fading

CSS3 enables us to create cross fading effect using only CSS. Previously we used jQuery or javascript for achieving this. Here, I am going to give an example of cross fading effect using only CSS3. This effect or this example can be used on your websites for showing...
Continue reading

Active style for navigation

All websites highlight the navigation item of the user’s location in the website, to help users orientate themselves. This is a fundamental requirement for basic usability. To achieve this, most of the developers use ‘active’ class for link in each page. They will have to change the HTML...
Continue reading

text-overflow ellipsis

Quite a while back, CSS added a feature to the text-overflow. The text-overflow declaration allows you to deal with clipped text: that is, text that does not fit into its box. text-overflow comes into play only when: a) the box has overflow other than visible (with overflow: visible...
Continue reading

CSS3 Shapes Examples

Here are the CSS3 shapes examples, most commonly used. Just copy and paste the given css and html for using css3 shapes in you web pages. css3 shapes examples – Circle HTML and CSS for Circle <div id="shape-circle"></div> #shape-circle { width: 120px; height: 120px; background: #434343; -moz-border-radius: 60px;...
Continue reading

CSS3 Rotate Animation

How to create a rotating image with CSS3? (CSS3 Rotate Animation) With the introduction of CSS3, animation is possible without using jQuery or Javascript. Here, I am giving an example of an image, rotating only with CSS. CSS3 animate and transform properties are used for achieving rotating effect....
Continue reading

CSS Star Rating

Star Rating possible with CSS? Star Rating possible with CSS? Do you think that we can create rating widget in our form without using any jquery plugin? Yes, it is possible. Using labels, radio buttons and few lines of css3, we can create star rating. The following is...
Continue reading