CSS阴影效果(兼容各种浏览器)

<!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>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>CSS阴影效果</title>
<style type="text/css">
    .popWindow
{
      width
:250px;height:auto;border:#909090 1px solid;background:#fff;color:#333;
      filter
:progid:DXImageTransform.Microsoft.Shadow(color=#909090,direction=120,strength=4);
      -moz-box-shadow
: 2px 2px 10px #909090;
      -webkit-box-shadow
: 2px 2px 10px #909090;
    
}
    .popWindow .popHead
{width:100%;height:30px; background:#E1E1E1;border-bottom:#909090 1px solid;}
    .popWindow .popHead .hTitle
{float:left;padding-left:12px;line-height:30px;color:#434343;font-size:13px;font-weight:bold;}
    .popWindow .popHead .hClose
{float:right;padding-right:12px;line-height:30px;color:#004080;font-size:13px; text-decoration:underline;}
    .popWindow .popBody
{width:100%;height:auto;padding:15px 0;border-bottom:#C6C6C6 1px solid;}
    .popWindow .popFoot
{width:100%;height:45px;}
    .popWindow .popFoot .btnDiv
{float:right;padding-right:15px;margin:9px 0;height:27px;}
    .popWindow .popFoot .btnDiv .btnOneRu
{width:76px;height:27px;border:0; background:url(btnOneRu.jpg) no-repeat;margin-right:25px;color:#333;text-align:center;cursor:pointer;}
    .popWindow .popFoot .btnDiv .btnOneDu
{width:76px;height:27px;border:0; background:url(btnOneDu.jpg) no-repeat;margin-right:25px;color:#333;text-align:center;cursor:pointer;}
}

</style>
</head>
<body>
<div class="popWindow">
    
<div class="popHead">
        
<div class="hTitle">批量修改</div>
        
<div class="hClose">关闭</div>
    
</div>
    
<div class="popBody">
        
<table width="100%" border="0" cellspacing="1" cellpadding="0">
          
<tr>
            
<td>&nbsp;</td>
            
<td>&nbsp;</td>
          
</tr>
          
<tr>
            
<td>&nbsp;</td>
            
<td>&nbsp;</td>
          
</tr>
          
<tr>
            
<td>&nbsp;</td>
            
<td>&nbsp;</td>
          
</tr>
        
</table>
    
</div>
    
<div class="popFoot">
        
<div class="btnDiv">
            
<input name="cancel" type="button" value="取  消" class="btnOneRu" />
            
<input name="save" type="button" value="确认修改" class="btnOneRu" />
        
</div>
    
</div>
</div>
</body>
</html> 


IE效果:


 

火狐效果:


代码下载:

pop.rar 

原文地址:https://www.cnblogs.com/zxjyuan/p/1773487.html