SOURCE

console 命令行工具 X clear

                    
>
console
<!DOCTYPE>  
<html>  
<head>  
    <meta charset="utf-8">  
    <!-- <link rel="stylesheet" type="text/css" href="style.css">   -->
</head>  
<body>  
  <div id="viewDiv">
    <ul class="nav">  
        <li>  
            <a href="" target="_blank">  
                基本工具<span class="triangle"></span></a>  
            <ul>  
                <li><a href="#" target="_blank">  
                    飞行模式 <span class="triangle"></span>  
                    </a>  
                    <ul>  
                        <li><a href="">线路飞行</a></li>   
                    </ul>
                </li>  
                <li><a href="">  
                    2D/3D转换 <span class="triangle"></span></a>  
                </li>   
            </ul>  
        </li>  
        <li><a href="">编辑工具<span class="triangle"></span></a>  
            <ul>  
                <li><a href=""><span class="triangle"></span></a>  
                </li>  
                <li><a href="">  
                    线 <span class="triangle"></span></a>  
                </li>
                <li><a href=""><span class="triangle"></span></a>  
                </li>  
            </ul>  
        </li>  
        <li><a href="">定量分析<span class="triangle"></span></a>  
            <ul>  
                <li><a href="">面积量算</a></li>       
            </ul>  
        </li>        
    </ul>  
    </div>
</body>  
</html>      
/* #viewDiv {
    padding: 0;
    margin: 0;
    height: 100%;
    width: 100%;
  } */
/* *{   
        padding: 0;   
        margin: 0;         
    }   */ 
    ul{   
        list-style-type:none;   
    }   
    .triangle{   
    
        font-size: 1em;   
        color: black;    
    }   
    a{   
        text-decoration:none;   
        text-align: left;   
        font-weight: bold;   
    
    }   
    /*一级导航*/  
    ul.nav{   
        float: left;   
        //border:1px solid gray;   
        margin-left: 10%;   
        margin-top:10px;   
        border-radius: 4px;   
        position: fixed;   
    }   
    ul.nav li{   
        float: left;   
        width: 9em;   
        background-color:white;   
    }   
    ul.nav a{   
        display: block;   
        color: black;   
        line-height: 1.5em;   
        //border-right: 1px solid white;   
        //border-left: 1px solid white;   
        padding: 5px;   
    }   
    
    ul.nav a:hover,   
    ul.nav a:focus{   
        color: black;   
        background-color: #D8D8D8;   
        opacity: 0.5;   
    }   
    ul.nav li:first-child a{   
        border-left: 0;   
        border-bottom: 0;   
    }   
    ul.nav li:last-child a{   
        border-right: 0;   
        border-bottom: 0;   
    }   
    /*二级导航*/  
    ul.nav li ul{   
        width: 10em;           
        position: absolute;   
        left: -1000em;   
    }   
        
    ul.nav li:hover ul{   
        width: 10em;   
        left:auto;   
    }   
        
    ul.nav li ul a{   
        border-top: 1px solid white;   
        border-bottom: 1px solid white;   
        border-left: 0;   
        border-right: 0;   
            
    }   
    /*三级导航*/  
    ul.nav li:hover ul li ul{   
        width: 10em;   
        position: absolute;   
        left: -1000em;   
    
    }   
        
    ul.nav li:hover ul li:hover ul{   
        left: auto;   
        margin-left: 9.1em;   
        margin-top: -2.1em;   
    }   
    ul.nav li:hover ul li:hover ul.nav1{   
        left: auto;   
        margin-left: -9.1em;   
        margin-top: -2.1em;   
    }