WebAppers

/ best free open source web resources /

Shopify

Decorate Your Images and Photos with CSS

Posted · Category: Gallery, Information

Nick La has made another great great tutorial for us. Nick La shows us how to decorate our images and photo galleries without editing the source images. The trick is very simple. All you need is an extra tag and apply a background image to create the overlaying effect. It is very easy and flexible with over 20 styles, from a simple image icon to a rounded corner to a masked layer (both decorative and complex). To change the look and feel, simply edit the CSS specifications of the span element. To show how flexible it is, Nick La has created 15 different styles as examples for us (notice the HTML markup is same).

Image Decoration

Source: CSS Decorative Gallery

10 Comments
  • http://antoine.olbrechts.eu/ Antoine

    Wow, great stuff, thanks a lot for the share !!

  • http://www.brainbackup.net Greg

    I like the idea of using this for artistic purposes. I did something similar about a year ago when I developed http://www.aitginc.com. I overlayed different logos on the products depending on which product line they were in. Connecting this concept with a database can be very powerful. Anyway, I like his designs.

  • http://davidcarreira.com D. Carreira

    Another great tutorial for Nick!

    Thanks for sharing this, David Carreira

  • http://www.latitudv.com Santiago

    Nice alternative for quick photo editing…

  • http://snapshark.co.uk Jake

    Wow, this is awesome!

    Webdesignerwall do it again!

  • MASSO

    WOAH THIS MAN IS THE CSS DESIGN GOD!
    GREAT ARTISTIC TOUCH

  • http://photoshop-dersi.blogspot.com grafik tasarim

    css layer examples / properties and layer attributes
    http://css-lessons.ucoz.com/css-layer-properties.htm

  • http://www.fedmich.com fedmich

    Very nice and easy to implement.
    Thanks for sharing

  • http://coachflash.com Coach

    Knocks my socks off!

  • jackiecookie

    Thank you!
    Beautiful and smart.

Supported By

Deals

Web Browsers Icon Set
Food Icon Set
Flat Icon Set

Flat Icon Set

100 icons