原理：利用两个层分别定义不同的边框颜色，一个在内，一个在外即可，在内的自适应。代码如下，已经测试通过：
<div style="width:300pxheight:30pxline-height:30pxborder:1px solid red"><div style="width:100%height:30pxline-height:30pxborder:1px solid green">文本内容
</div>
</div>
<div style="border:#096 solidwidth:440"><img src="*.jpg" width="440" height="247" />
</div>
box-shadow：给元素块添加周边阴影效果。
语法：box-shadow: h-shadow v-shadow blur spread color inset
*还有另一种情况： box-shadow: 0 2px 2px #FECC84
当我们在色值前只写了三个数值的情况下，则第三个值是 blur （模糊距离）。
利用阴影属性，也可以实现外边框的效果：
当我们再为它添加一个 outline （轮廓），就会发现它实现了-边框内圆角：
* 关于为什么会这样：
outline的描边并不会跟着圆角走，因此显示为直角。
所以把这两者叠加到一起，box-shadow 则刚好填补描边与容器圆角之间的空隙。
*值得注意的是，box-shadow 阴影的大小值并不一定等于描边的宽度，它和圆角的大小有关系。所以只需要一个足够填补空隙的大小就可以了。事实上，制定一个等于描边宽度的值在某些浏览器中可能会渲染异常，所以，最好是稍小的值。
参考书籍： Lea Verou 《CSS揭秘》
