#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. 手脱nSPack 2.1 - 2.5

    1.载入PEID 使用核心扫描出的结果 nSPack 2.1 - 2.5 -> North Star/Liu Xing Ping 2.载入OD,一进来就是一个大跳转,F8跟着走 >- E9 ...

  2. Hadoop YARN 的工作流程简述

    1.Client 向 YARN 提交应用程序,其中包括 ApplicationMaster 程序及启动 ApplicationMaster 命令2.ResourceManager 为该 Applica ...

  3. wx.request 获取不到post传递的值

    微信小程序的wx.request请求,method设为POST并向后台传递数据,但从后台返回的信息来看后台并没有获得传递的数据 wx.request({              url: 'url' ...

  4. java io-1基本概念

    java io-1基本概念 2015-07-03 15:17 648人阅读 评论(0) 收藏 举报  分类: [JavaSE](37)    目录(?)[+]   ------------------ ...

  5. NDK编译时两 .so之间调用问题

    Android C++(NDK)项目需要调用别人的代码,因此将其编译成了.so库,而自己的代码也编成了一个.so库. 结果编译成功,但是在运行时自己的.so调用别人的.so会失败,提示说没有正确传入参 ...

  6. Ubuntu 火狐浏览器中,鼠标选择文字被删除的解决办法

    copy from :http://blog.csdn.net/shadow066/article/details/50628019 在终端中输入命令:ibus-setup 将 “在应用程序窗口中启用 ...

  7. [转]hadoop2.x常用端口

    原文地址:http://www.zhixing123.cn/ubuntu/40649.html HDFS DataNode 50010 dfs.datanode.address datanode服务端 ...

  8. form:select form:options 标签数据回显

    在jsp页面中经常会使用到 form:select form:options 遍历后台List集合生成 select 下拉选择器,但是 form:options 标签并没有提供一个可以回显数据的属性. ...

  9. 原生JS实现省市区(县)三级联动选择

    原文地址→看过来 写在前面 前段时间写一个关于天气的东西,里面的省市区(县)城市选择让我很头疼,在网上搜索出来大都是借助插件或者第三方库,感觉这样做代码会很重,所以索性就把几种城市选择的方式实现一遍, ...

  10. ES6核心,值得驻足花一天时间来学习

    1.let 和 const 命令 在es5时,只有两种变量声明,var 和function.在es6中新增了四种let和const,以及另外两种声明import和class. 我们先讲解let和con ...