#classify ul li div{width:100px;  height:200px;  display:none;  position:absolute;  left:100px;  top:0px;}
    
#classify ul li:hover div {  display:block;}

 

主要用到的CSS代码就是上面用的这两个CSS了
  1. display 的功能就是显示,  none 的时候就不会显示出来, 默认值为 inline 就是接着显示在下面
  2. display 的属性值为 block ; 表示是一个块来显示, 一个元素会换行一次, 这里当然不用这个也可以,我们需要的只是把div 显示出来而已, 用inline 也是可以的
  3. 还有一个重要的元素就是 position ,这个就是位置的排版 ,这里是用绝对位置 , 就是用width , height , top , left , right 来控制这个二级目录的位置 .

然后就没有了,这个其实比较容易 , 没有涉及到js , 能够比较简单的实现了 , 当然效果也是不赖 , 还有就是很多网站都是必须要用到这个的

HTML如何创建二级目录的更多相关文章

  1. 利用php函数mkdir递归创建层级目录

    项目开发中免不了要在服务器上创建文件夹,比如上传图片时的目录,模板解析时的目录等.这不当前手下的项目就用到了这个,于是总结了几个循环创建层级目录的方法. php默认的mkdir一次只能创建一层目录,而 ...

  2. 通过phoenix在hbase上创建二级索引,Secondary Indexing

    环境描述: 操作系统版本:CentOS release 6.5 (Final) 内核版本:2.6.32-431.el6.x86_64 phoenix版本:phoenix-4.10.0 hbase版本: ...

  3. Yii2中如何访问controller的二级目录下的控制器

    Yii2默认的控制器下只有一层目录放在controller目录下,当开发的需要的时候需要在该目录下面新增一层目录也就是在controller下增加二级目录,比如controller/api/Membe ...

  4. 带二级目录的Nginx配置------目前找到的最简单的方法

    由于项目不知一个,所以不得不为每一个项目建一个专有的文件夹,这就导致了在配置nginx的时候会出现二级目录 目前找到的最简单的方法     - step1:修改 vue.config.js   添加配 ...

  5. Phoneix(三)HBase集成Phoenix创建二级索引

    一.Hbase集成Phoneix 1.下载 在官网http://www.apache.org/dyn/closer.lua/phoenix/中选择提供的镜像站点中下载与安装的HBase版本对应的版本. ...

  6. thinkphp 3.2 linux二级目录安装

    详解:http://document.thinkphp.cn/manual_3_2.html#url_rewrite 注意:linux系统对大小写敏感 服务器系统:linux (阿里云服务器) thi ...

  7. MFC 创建多层目录

    创建多层目录 BOOL CTestToolCtr::CreateFolder(CString strNewFolder) { /************************************ ...

  8. php使用递归创建多级目录

    <?php header('Content-type:text/html;charset=utf8'); echo "Loading time:".date('Y-m-d H ...

  9. PHP判断文件夹是否存在和创建文件夹的方法(递归创建多级目录)

    在开始之前,我先说明一下,可能许多朋友与我一样认为只要给一个路径,mkdir就可以创建文件夹,其实不是那样,单个的MKDIR只能创建一级目录,对于多级的就不行了,那如何用mkdir来创建呢?先我抄一段 ...

随机推荐

  1. JS中的new操作符原理解析

    var Person = function(name){ this.name = name; } Person.prototype.sayHello = function() { console.lo ...

  2. 如何在Lunix云服务器上安装Mysql进行远程连接

    说说这个服务器上安装mysql真是一个大坑啊 ! 我也不知道自己怎么心血来潮就买一个百度云服务器,然后就想着吧自己做的一些小项目都跑上去.嘿嘿...其实就是想显摆下,写点小应用给不是编程的朋友们使用 ...

  3. 莫队+分块 BZOJ 3809

    3809: Gty的二逼妹子序列 Time Limit: 80 Sec  Memory Limit: 28 MBSubmit: 1634  Solved: 482[Submit][Status][Di ...

  4. Flying to the Mars

    D - Flying to the Mars Time Limit:1000MS     Memory Limit:32768KB     64bit IO Format:%I64d & %I ...

  5. 【BZOJ】3771: Triple FTT+生成函数

    [题意]给定n个物品,价值为$a_i$,物品价格互不相同,求选一个或两个或三个的价值为x的方案数,输出所有存在的x和对应方案数.$ai<=40000$. [算法]生成函数+FFT [题解]要求价 ...

  6. iOS7开发-Apple苹果iPhone开发Xcode官方文档翻译PDF下载地址(2014年2月19日更新版)

    //转载请注明出处--本文永久链接:http://www.cnblogs.com/ChenYilong/p/3496069.html     编号 iOS-Apple苹果官方文档翻译名称 博文链接地址 ...

  7. 【NOIP2013提高组T3】加分二叉树

    题目描述 设一个n个节点的二叉树tree的中序遍历为(1,2,3,…,n),其中数字1,2,3,…,n为节点编号.每个节点都有一个分数(均为正整数),记第i个节点的分数为di,tree及它的每个子树都 ...

  8. 45、如何使用python删除一个文件?

    若想利用python删除windows里的文件,这里需要使用os模块!那接下来就看看利用os模块是如何删除文件的! 具体实现方法如下! os.remove(path) 删除文件 path. 如果pat ...

  9. c语言学习笔记.指针.

    指针: 一个变量,其值为另一个变量的地址,即,内存位置的直接地址. 声明: int *ptr; /* 一个整型的指针,指针指向的类型是整型 */ double *ptr; /* 一个 double 型 ...

  10. 深入理解Spring系列之八:常用的扩展接口

    转载 https://mp.weixin.qq.com/s/XfhZltSlTall8wKwV_7fKg Spring不仅提供了一个进行快速开发的基础框架,而且还提供了很多可扩展的接口,用于满足一些额 ...