Web Designers Guide To CSS 3

For those who are new to CSS3, I will begin by explaining the definition. In short, CSS3 is short for Cascading Style Sheets 3 and is the most recent version of CSS. It offers a wide variety of new ways to improve your website designs incorporating the biggest change in CSS3; the introduction of modules.

The advantage of this feature is that the specification can be completed and approved much faster because each module will contain less code. Another bonus of the modularisation means that users or developers can easily maintain and develop the system as they can update individual modules, test them and then integrate them as a whole when need be, allowing for greater flexibility.

This version of CSS has been around for a while but is waiting for browsers to support it fully before it can be properly rolled out as a standard. There are browsers available that support some CSS3 modules but it could be a year or two before they can support all of them.

I will be explaining the current browser support for CSS3 and some of the main features that are available.

Browser support:

Only a few web browsers can support most CSS3 modules, but they still have to be updated to support all of the modules. The best browsers for CSS3 at the moment are Mozilla Firefox, Opera, Safari and Google Chrome and in the next couple of years they will hopefully support the majority of CSS3 modules. Internet Explorer 7 & 8 still has very limited support for CSS3.

If you decide to use CSS3 in your website design, make sure that you include fallback code for the browsers that don’t support it.

Features In CSS3:

CSS3 is packed full of new features to give it more power and I have listed some of the main features below:

• Selectors
• Text Effects
• Multi-Column Layout
• Borders
• Ruby
• Backgrounds

Selectors:

Selectors will help developers select specific levels of the document to work with. An advantage of this module is that many browsers already support it, making CSS3 a popular choice.

Text Effects:

Lots more options are available in CSS3 for text effects, which include text shadow, word wrapping and overflow. Text shadow allows you to apply a drop shadow into any text and change the colour and size of the shadow. Text wrap will all you to easily wrap the text and overflow allows you to clip text that doesn’t fit in an element.

Multi-Column Layout:

This is a vital module present in CSS3 as it enables users to put content into multiple columns. The main advantage of this module is that there is no need for users to scroll up and down to read text from one column to the other and also eliminates the need for horizontal scrolling. It also wraps text correctly making a site easier to read and allowing a user to embed more text into a single page.

Borders:

CSS3 adds three new rules to border effects which include border radius, border image and border shadow. Border radius will allow you to create rounded borders. Border image lets you create borders using any image you want. The final rule is border shadow, which will let you put shadows on borders.

Ruby:

This is another important module of CSS3 as it allows programmers to add annotations on top of or next to words where required, making difficult parts of text more meaningful to users.

Backgrounds:

There are four background effects in CSS3; background size, background clip, background origin and multiple backgrounds. Background size will let you resize the background to any size needed. The background clip effect determines whether the background will fade into the border. Background origin will determine how the position of a background will be calculated in a box. Finally, multiple backgrounds will allow you to put more than one background image into one element.

These are just a few of the great features that are available in CSS3 and using it will enhance the development of web designs with its user friendliness and efficiency.

To find out more information about CSS3 and all the available modules, visit the .

Related posts:

  1. Web Design GM’s jQuery Favorites
  2. Cross Browser Testing
  3. How To Speed Up Your WordPress Blogs

Tags: ,

Leave a Reply


Contact Us Today...

If you have any questions about our services or want to arrange a free no obligation consultation contact us today or call 02920 290 080 for Cardiff and 01179 000 482 for Bristol.

Bit Torrent Study Discovers Most File Sharers Are Now Monitored

Ever heard of torrents or used Bit Torrent to download movies, music or shared files over the internet? Researchers have discovered that anyone who does use Bit Torrent to download files over the World Wide Web will most probably be monitored. Studies were carried out by Birmingham University and they have discovered that if someone [...]
» more

Cardiff: 02920 290 080 Bristol: 01179 000 482