web studio 4.0

The top image here has a border made with coding this is what it really looks like below

It involves a little bit more coding so we'll look at that farther down.

My 1907 craftsman

My coast No. California ©

border-style: outset;
border-style: double;
border-style: dotted;
border-style: groove;

The "double" border above is pretty easy. Just one line of code pasted into your picture object. Click on the "code" button above to see how.

border-style: inset;
border-style: solid;

outset

border-style: dashed;
border-style: ridge;

dashed

solid

 inset

ridge

double

dotted

groove

The different BORDER styles

This background is really just a sign put in an HTML object.

My trip to Yosemite one of those places you have to see.

My old 1907 craftsman ©

My yosemete trip   ©

Let's dive right in... first let's work with images and css borders

The borders below are are a little more complex

A "groove"  border is used above.
This really makes a change in the character of the image

Let's take images one step farther and make a whole page using just css like the borders here.

This image uses an opaque border... you can see through it.

The page above uses 5 HTML objects and a tiny bit of code... no pictures, have a look.  It's only 3k of (psuedo)images!

This page last modified on Sunday, February 05, 2006