zoukankan      html  css  js  c++  java
  • tab导航 img样式 PHP

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

      


    欢迎转载,转载请注明:转载自[ http://www.cnblogs.com/zjfree/ ]
  • 相关阅读:
    Oracle普通表->分区表转换(9亿数据量)
    RHEL6.4 + Oracle 11g DG测试环境快速搭建参考
    java 获取时间戳的三种方式
    java sm3加密算法
    java byte数组与String互转
    Java的多线程
    最大重叠点
    23. 客户默认选项(Default Customer Options)
    Android Studio 1.3RC版 build加速
    查看linux机器是32位还是64位的方法
  • 原文地址:https://www.cnblogs.com/zjfree/p/2218726.html
Copyright © 2011-2022 走看看