<!doctype html public "-//w3c//dtd xhtml 1.0 transitional//en" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>css边框阴影_code by http://www.codefans.net</title>
<style>
.dropshadow2{
float:left;
clear:left;
background: url(http://codefans.net/jscss/demoimg/200903/shadowalpha.png) no-repeat bottom right !important;
background: url(http://codefans.net/jscss/demoimg/200903/shadow.gif) no-repeat bottom right;
margin: 10px 0 10px 10px !important;
margin: 10px 0 10px 5px;
width: 360px;
padding: 0px;
}
.innerbox{
position:relative;
bottom:6px;
right: 6px;
border: 1px solid #999999;
padding:4px;
margin: 0px 0px 0px 0px;
/* ie5 hack */
margin: 0px 0px -3px 0px;
margin: 0px 0px 0px 0px;
.innerbox p{
font-size:14px;
margin: 3px;
</style>
<meta http-equiv="content-type" content="text/html; charset=gb2312" /></head>
<body>
<div class="dropshadow2"><div class="innerbox"><h4>css阴影：</h4> <p>这段边框阴影效果怎么样呢？</p></div></div>
</body>
</html>
这是一个边框阴影的实现．其中用到了!important．它的作用是提高样式规则的应用优先权，最重要一点是ＩＥ一直都不支持这个语法，而其他的浏览器都支持，因此这们就可以利用这这一点来分别给ＩＥ和其他浏览器不同的样式定义．
![8个道理，让你的程序人生受益终生[图]](data:image/gif;base64,R0lGODlhAQABAIAAAP///wAAACwAAAAAAQABAAACAkQBADs=)