如何用DIV+CSS实现word边框阴影
我要把一个一DIV设置成word边框阴影,这个CSS3属性写在哪里呢?我怎么试都没效果出来,能帮我解决下吗?谢谢!例如:<divheight:20px;width:300...
我要把一个一DIV设置成word边框阴影,这个CSS3属性写在哪里呢?我怎么试都没效果出来,能帮我解决下吗?谢谢! 例如:<div height:20px; width:300px;>仿word边框阴影</div>;
展开
3个回答
展开全部
用两个层
<!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=GB2312">
<title></title>
</head>
<body>
<div style="height:22px;width:302px;border-right:1px #ccc solid;border-bottom:1px #ccc solid;">
<div style="height:20px; width:300px;border:1px #333 solid;"></div>
</div>
</body>
</html>
这样由于边框是1px 但如果边框加宽后,那个阴影和内边框是平行的,效果又太假..
只用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=GB2312">
<title></title>
</head>
<body>
<div style="height:22px;width:302px;border-right:1px #ccc solid;border-bottom:1px #ccc solid;">
<div style="height:20px; width:300px;border:1px #333 solid;"></div>
</div>
</body>
</html>
这样由于边框是1px 但如果边框加宽后,那个阴影和内边框是平行的,效果又太假..
只用css很难做出来,或者是做出来了兼容性也太差,而且搞不好代码也很长...
不如直接做一个图片 只做阴影部分,直接放在层里当背景,而且这样的图片体积也会很小
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询