Infographic: Quick Look into CSS3 Properties

Infographic: Quick Look into CSS3 Properties

These days you’ll see a lot of infographics on the web. Infographics are a great way to illustrate information and transform complex topics into simple explanations. So why not make one?

In today’s article we’re showcasing an infographic, designed exclusively for Onextrapixel, by graphic designer Teresa Sposato.

Infographic: Quick Look into CSS3 Properties

Teresa Sposato wanted to create an infographic but the only thing missing to get her to his first infographic was the topic. As she was working with CSS3 on a daily basis to create more interesting designs for her clients’ websites, one of the first possible topics that came to her mind was “CSS3 properties”. She ‘Googled’ it and found exactly the article and information needed.

So she decided to make use of the article written by Christian Krammer on Onextrapixel: The Most Important CSS3 Properties Explained which introduces the reader to CSS3 properties that have general support in all contemporary browsers. This infographic takes that useful information, packs it all into one compact illustrated piece to print out and always have handy to look at when needing the right property while coding.

For a full large resolution image, click on the image below:

Infographic: Quick Look into CSS3 Properties

Thanks to Teresa Sposato for this great infographic. You can follow her @TeresaSposato on Twitter.

Are there any properties that we have missed out? We hope you have enjoyed this CSS3 properties infographic and do share any of your feedback below.

Onextrapixel, or more commonly known as OXP is dedicated to delivering useful, comprehensive and innovative information for designers, developers and many others.

Comments

  1. / Reply

    Nice graphic, let’s hope non css3 browsers die out soon.

    (you may want to fix the description of transition, it’s the same as border-radius.)

    1. / Reply

      Hi Martin,

      We have amended it. Thanks for the feedback.

    • Bill Zacht,
    • September 24, 2011
    / Reply

    It’s incomplete… The descriptions are wrong. Nice start though.

    1. / Reply

      Hi Bill, can you let us know what is missing? For the wrong description, we have already amended it.

    • Paul,
    • September 24, 2011
    / Reply

    Nice work.

    My favourite CSS3 feature is animation gives you so many options.

  2. / Reply

    useful presentation. thanks

  3. / Reply

    Border-Radius is by far my favourite CSS3 property! Now, if only web users would ditch those older browsers!

    • Chris,
    • September 26, 2011
    / Reply

    box-shadow can also accept a fourth value for “spread distance”, after the value for “blur distance”.

    • Rana mukherjee,
    • September 27, 2011
    / Reply

    Nice

  4. / Reply

    Nice

  5. / Reply

    Very nice contact forms.

  6. / Reply

    useful presentation. thanks

    • fahad,
    • November 9, 2011
    / Reply

    Specifying more then one backgrounds is like a ” dream comes true ” to me it’s the most useful property of CSS 3

Leave a Reply

Your email address will not be published. Required fields are marked *

Deals

Elegant Themes Coupon Code: 20% discount

While most other WordPress theme sites charge per theme, Elegant Themes is an amazing deal as you pay just once for access to 87 premium WordPress themes and a…

WrapPixel Coupon – 25% Discount

If you’re looking for an HTML or PSD template for your next website, checkout the selection of templates at WrapPixel made for web developers, designers, and agencies. You can…