.shadows {
box-shadow: 12px 12px 10px #888888, -12px -12px 10px #FFFFFF, -12px 12px 10px #888888;
}以上是一段CSS代码，其中的box-shadow属性就是用来实现三边投影效果的。下面让大家来逐一解释。
首先是12px 12px 10px #888888，这一段表示的是右下方的投影，分别代表横向偏移量、纵向偏移量和模糊距离，最后一个参数是投影颜色，这里设为#888888。
然后是-12px -12px 10px #FFFFFF，这一段表示的是左上方的投影，注意这里的横向偏移量和纵向偏移量都是负值，因为是往左上方投影。投影颜色也不同，这里设为#FFFFFF。
最后一行-12px 12px 10px #888888则是左下方的投影，与右下方的相似，只是位置不同。投影颜色仍为#888888。
通过对这三个投影进行组合，就能够实现CSS三边有投影的效果了。
当然，在实际应用中，还可以根据需要进行调整，比如改变偏移量、模糊距离、投影颜色等参数，来达到不同的效果。总之，掌握了CSS三边有投影的技巧，就能够为网页设计加分不少。