请使用CHROME浏览器查看。
TAB导航样式
asdfasdfasdfasdfasdf
代码
<style type="text/css"> .divTab { position:relative; top:2px; margin-left:10px; } .divContent { -webkit-box-shadow:0px 0px 10px #ddd; -moz-box-shadow:0px 0px 10px #ddd; box-shadow:0px 0px 10px #ddd; } .divTab a { text-shadow:1px 1px 5px #999; display:block; float:left; margin-right:5px; border:solid 2px #ddd; padding:0px 10px; -webkit-border-top-left-radius:5px; -webkit-border-top-right-radius:5px; background-color:#eff; color:gray; text-decoration:none; cursor:pointer; } .divTab a:hover { background-color:#fef; } .divTab .aCur { border-bottom:solid 2px white; background-color:white; color:blue; cursor:default; } .divTab .aCur:hover { background-color:white; } </style> <div class="divTab" style=""> <a href="#">TAB1</a> <a href="#" class="aCur">TAB1</a> <a href="#">TAB1</a> <a href="#">TAB1</a> </div> <div class="divContent" style="border:solid 2px #ddd; padding:10px; clear:both;"> asdfasdfasdfasdfasdf </div>
IMG样式
代码
<style type="text/css"> .divImg img { -webkit-box-shadow:0px 0px 10px #666; -moz-box-shadow:0px 0px 10px #666; box-shadow:0px 0px 10px #666; border:solid 5px white; outline:1px solid gray; width:200px; height:150px; margin:30px; *border:solid 5px gray; } .divImg img:hover { -webkit-box-shadow:0px 0px 10px red; -moz-box-shadow:0px 0px 10px red; box-shadow:0px 0px 10px red; *border:solid 5px red; } </style> <div class="divImg"> <img alt="" src="1.jpg" /> <img alt="" src="1.jpg" /> <img alt="" src="1.jpg" /> <img alt="" src="1.jpg" /> <img alt="" src="1.jpg" /> </div>
欢迎转载,转载请注明:转载自[ http://www.cnblogs.com/zjfree/ ]