Tres tipos de bordes

En este ejemplo se utilizan tres propiedades crear tres bordes diferentes alrededor de una imagen o un párrafo cualquiera. De adentro hacia a fuera: padding, border y outline:

<style>.
outline {
display: block;
margin: 0 auto;
border: 1px solid #779;
outline: 1px solid #CCE;
padding: 4px;  /* tendrá el color de fondo o agregamos background-color:VALOR; */
}
</style>
<img class="outline" src="URL_imagen" />

Un poco más complejo. Dentro de un DIV colocamos una etiqueta SPAN y luego un párrafo en una etiqueta P. El DIV lo posicionamos de manera relativa para que su contenido pueda ser posicionado de manera absoluta. La etiqueta SPAN la dimensionamos y allí le ponemos como fondo, una gradiente para todos los navegadores. El párrafo lo posicionamos de manera relativa, separándolo del SPAN mediante la propiedad top y le ponemos un borde:

<style>
.gradiente {
margin: 20px auto;
position: relative;
width: 500px;
}
.gradiente span {
height: 10px;
position: absolute;
width: 100%;
-moz-border-radius-topleft: 10px;
-webkit-border-radius-topleft: 10px;
border-radius-topleft: 10px;
background-image: -moz-linear-gradient(100% 100%  180deg, #101921, #885555);
background-image: -webkit-gradient(linear, left bottom, right top, from(#101921), to(#444F5A));
filter:progid:DXImageTransform.Microsoft.Gradient(GradientType=1, StartColorStr='#FF885555', EndColorStr='#FF101921');
}
.gradiente p {
border-left: 10px solid #855;
margin: 0;
padding: 10px;
position: relative;
top: 10px;
}
</style>
<div class="gradiente">
<span></span>
<p> ... el contenido ... </p>
</div>

Minim reprobo, eu, enim, abbas cui duis premo incassum te obruo abluo nostrud. Hendrerit, dolore laoreet, imputo autem elit esse. Ventosus veniam uxor tum nostrud duis eu cogo ad, tamen hendrerit vel quis. Nostrud et ad qui nostrud, reprobo sagaciter elit.

Un ejemplo sencillo de sohtanaka.com para agregar sombras suaves:

<style>
.shadow {
background-color: #444;
border-color: #555 #777 #777 #555;
border-style: solid;
border-width: 1px 2px 2px 1px;
margin: 0 auto;
padding: 20px;
width: 500px;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
.shadow h2 {
color: #EEE;
font: 2em Georgia,serif;
margin: 0;
padding: 0
}
</style>
<div class="shadow">
<h2>El Título</h2>
<p> ... el contenido ... </p>
</div>

Light Shadow

Minim reprobo, eu, enim, abbas cui duis premo incassum te obruo abluo nostrud. Hendrerit, dolore laoreet, imputo autem elit esse. Ventosus veniam uxor tum nostrud duis eu cogo ad, tamen hendrerit vel quis. Nostrud et ad qui nostrud, reprobo sagaciter elit.