Formatting pictures to look sunken

Discussion in 'Web Design & Programming' started by Ferg, May 22, 2007.

  1. Ferg

    Ferg Manbearpig

    Likes Received:
    0
    Trophy Points:
    16
    I have recently taken over web-maintenance of a website and all the pictures that have been used have a 1pixel border all the way round each pic, the top and left hand sides have a black border while the right and bottom border is white, this gives the picture a nicely sunken look when actaully on a site.

    I have Fireworks/CS3/PSP and can not find any 'easy' method to format pictures in this way so am having to do each one manually, am I missing something ... is there a 'Make a picture look good with a decent border' button I'm blind too?

    (I know that the designer before me used fireworks so am sure there must be something in that)

    Would greatly appretiate anyone enlightening me ;)
     
  2. Matt555

    Matt555 iMod

    Likes Received:
    98
    Trophy Points:
    48
    You can use CSS to style an images border without actually editing the picture.

    Code:
    .sunken_border {
    border-style: solid;
    border-width: 1px;
    border-top: #000000;
    border-right: #FFFFFF;
    border-bottom: #FFFFFF;
    border-left: #000000;
    }
    Then just use:
    Code:
    <img src="image.jpg" alt="An image" class="sunken_border" />
    To put that border on an image :)
     
  3. Ferg

    Ferg Manbearpig

    Likes Received:
    0
    Trophy Points:
    16
    I like it! and will do that from now on. Thanks matt

    But all the pictures are definatley pre-edited, it'll bug me if I never find out how he did it :D
     
  4. Sniper

    Sniper Administrator Staff Member

    Likes Received:
    59
    Trophy Points:
    63
    with CSS you will have an advantage because if you change the site design you won't have to edit the pictures again to fit in with the new design.

    I think in Photoshop you will probably have to create an "Action" to automate the process, if that's what you mean.
     
  5. Matt555

    Matt555 iMod

    Likes Received:
    98
    Trophy Points:
    48
    Yeah, you can create a layer style and then an automated process to 'batch' process files :)
     

Share This Page