zoukankan      html  css  js  c++  java
  • 下拉框架

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>无标题文档</title>
    <link href="Untitled-下拉.css" rel="stylesheet" type="text/css" />
    <style>
    *
    {
    	margin:0px;
    	padding:0px;}
    </style>
    </head>
    
    <body>
    <div class="a" id="a">
    <div class="a1" >
    <div class="a2" id="a2"><div class="a21" ><div class="a22"></div><div class="a32"></div><div class="a42"></div></div></div>
    <div class="a3" id="a3"><div class="a31" ></div></div>
    <div class="a4" id="a4"><div class="a41" ></div></div>
    </div></div>
    
    </body>
    </html>
    

      

    @charset "utf-8";
    /* CSS Document */
    /*小矿*/
    .a
    {
    	80px;
    	height:40px;
    	background-color:#090;
    	position:absolute;
    	border:1px solid black;
    	left:80px;
    	top:100px;
    	}
    	#a/*超出部分隐藏*/
    	{overflow:hidden;}
    #a:hover/*鼠标放在上边显示*/
    {
    	overflow:visible}
    
    	.a1
    {
    	80px;
    	height:120px;
    	border:1px solid black;
    	left:0px;
    	top:40px;
    	position:absolute;}
    
    .a2
    {
    	80px;
    	height:40px;
    	background-color:#F00;
    	position:absolute;
    	border:1px solid black;
    	left:0px;
    	top:0px;
    	}
    	#a2
    	{overflow:hidden;}
    	#a2:hover
    	{
    		overflow:visible}
    		.a21
    		{
    			80px;
    			height:120px;
    			position:absolute;
    			border:1px solid black;
    			left:80px;
    			top:0px;
    			background-color:#F00;}	
    		     .a22
                      {
    	                 80px;
    	                height:40px;
    	            background-color:#F00;
    	              position:absolute;
    	                 border:1px solid black;
    	                 left:0px;
    	                 top:0px;
    	                           }
    	.a32
    {
    	80px;
    	height:40px;
    	background-color:#F00;
    	position:absolute;
    	border:1px solid black;
    	left:0px;
    	top:40px;
    	}
    	.a42
    {
    	80px;
    	height:40px;
    	background-color:#F00;
    	position:absolute;
    	border:1px solid black;
    	left:0px;
    	top:80px;
    	}			
    	.a3
    {
    	80px;
    	height:40px;
    	background-color:#F0F;
    	position:absolute;
    	border:1px solid black;
    	left:0px;
    	top:40px;
    	}
    	#a3
    	{overflow:hidden;}
    	#a3:hover
    	{
    		overflow:visible}
    		.a31
    		{
    			80px;
    			height:120px;
    			position:absolute;
    			border:1px solid black;
    			left:80px;
    			top:0px;
    			background-color:#F0F;}
    	.a4
    {
    	80px;
    	height:40px;
    	background-color:#F69;
    	position:absolute;
    	border:1px solid black;
    	left:0px;
    	top:80px;
    	}
    	#a4
    	{overflow:hidden;}
    	#a4:hover
    	{
    	overflow:visible}
    	.a41
    		{
    			80px;
    			height:120px;
    			border:1px solid black;
    			position:absolute;
    			left:80px;
    			top:0px;
                background-color:#F69;}
    

      

  • 相关阅读:
    1107 Social Clusters (30)
    1066 Root of AVL Tree (25)
    1099 Build A Binary Search Tree (30)
    1064 Complete Binary Search Tree (30)
    1043 Is It a Binary Search Tree (25)
    Hadoop学习总结(1)——大数据以及Hadoop相关概念介绍
    MyBatis学习总结(10)——批量操作
    MyBatis学习总结(10)——批量操作
    Java基础学习总结(23)——GUI编程
    Java基础学习总结(23)——GUI编程
  • 原文地址:https://www.cnblogs.com/zhangdemin/p/5548407.html
Copyright © 2011-2022 走看看