CSS仿Win7对话框黑色阴影效果
CSS仿Win7对话框黑色阴影效果,采用了CSS3的一个新属性,对所有新版本浏览器都支持,老版本的浏览器部分不支持。
兼容IE新版、Google浏览器、火狐浏览器,分别对应着三个属性:box-shadow、-webkit-box-shadow、-moz-box-shadow。
效果图:

<title>CSS仿Win7对话框黑色阴影效果</title>
<style>
body {background:#EFEFEF;height:1000px;}
#box {
width:441px;
height: 249px;
right: 50%;
bottom: 50%;
margin-right: -235px;
margin-bottom: -115px;
position:fixed;
_position: absolute;
_top: expression(eval(document.documentElement.scrollTop+document.documentElement.clientHeight-this.offsetHeight-(parseInt(this.currentStyle.marginTop,10)||0)-(parseInt(this.currentStyle.marginBottom,300)||200)));
box-shadow: 0 0 35px #000;
-webkit-box-shadow: 0 0 35px #000;
-moz-box-shadow: 0 0 35px #000;
}
</style>
<div id="box"></div>
<p>CSS仿Win7对话框黑色阴影效果</p> 相关文章
- 利用CSS的hover伪类实现的下拉菜单效果
利用CSS的hover伪类实现的下拉菜单效果,未使用任何js代码,简单方便。 效果截图:
- CSS改变选中文本背景色和文字颜色
CSS改变选中文本背景色和文字颜色。 效果截图:
- CSS blockquote美化效果
blockquote相信大家都不陌生吧,在Word叫文本框,其实在网页了可叫它文本框吧,如果在一段文本的两头加上blockquote标签的话,那么文本将会接出来显示,而且其内的文本将含有blockquote的格式,所以只要用CSS定义好了blockquote的各个属性,你会发现这会是个
- 手机站常用的底部导航条,宽度自适应
手机站常用的底部导航条,宽度自适应。 代码打包下载: 手机站常用的底部导航条,宽度自适应 效果截图:
- 手机站头部超赞QQ邀请效果
手机站头部超赞QQ邀请效果,已整理为JS调用代码,方便直接引入网页调用。 打包下载: 手机站头部超赞QQ邀请效果 效果截图:
随机推荐
- 利用CSS的hover伪类实现的下拉菜单效果
利用CSS的hover伪类实现的下拉菜单效果,未使用任何js代码,简单方便。 效果截图:
- CSS改变选中文本背景色和文字颜色
CSS改变选中文本背景色和文字颜色。 效果截图:
- CSS blockquote美化效果
blockquote相信大家都不陌生吧,在Word叫文本框,其实在网页了可叫它文本框吧,如果在一段文本的两头加上blockquote标签的话,那么文本将会接出来显示,而且其内的文本将含有blockquote的格式,所以只要用CSS定义好了blockquote的各个属性,你会发现这会是个
- 手机站常用的底部导航条,宽度自适应
手机站常用的底部导航条,宽度自适应。 代码打包下载: 手机站常用的底部导航条,宽度自适应 效果截图:
- 手机站头部超赞QQ邀请效果
手机站头部超赞QQ邀请效果,已整理为JS调用代码,方便直接引入网页调用。 打包下载: 手机站头部超赞QQ邀请效果 效果截图: