请使用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;
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>