<!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>

<style type="text/css">

#apDiv1 {

    position: absolute;

    width: 100%;

    height: 50px;

    z-index: 1;

    background-color:#F00;

}

#apDiv2 {

    position: relative;

    margin:auto;

    width:960px;

    height: 50;

    z-index: 2;

    background-color:#3F6

}

.apDivx {

    position: relative;

    float:left;

    width: 99px;

    height: 50px;

    z-index: 3;

    background-color:#FF0;

    overflow:hidden;

}

.apDivy {

    position: relative;

    float:left;

    width: 99px;

    height: 50px;

    z-index: 3;

    background-color:#FF0;

}

#apDiv4 {

    position: absolute;

    top: 50px;

    width: 200px;

    height: 91px;

    z-index: 2;

    background-color:#F3C

}

</style>

</head>

<body>

<div id="apDiv1">

    <div id="apDiv2">

        <div id="apDiv3" class="apDivx" onmouseover="this.className='apDivy'"  onmouseout="this.className='apDivx'">

        首页

                <div id="apDiv4">

            战争<br>

            剧情<br>

            爱情<br>

               </div>

        </div>

        <div id="apDiv3" class="apDivx" onmouseover="this.className='apDivy'"  onmouseout="this.className='apDivx'">

        电影

                <div id="apDiv4">

            速度与激情7<br>

            复仇者联盟2<br>

            左耳<br>

               </div>

        </div>

    </div>

</div>

</body>

</html>

div居中鼠标悬浮显示下拉列表的更多相关文章

  1. Winform中设置ZedGraph鼠标悬浮显示举例最近曲线上的点的坐标值和X轴与Y轴的标题

    场景 Winform中设置ZedGraph鼠标双击获取距离最近曲线上的点的坐标值: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/ ...

  2. echarts —— tooltip 鼠标悬浮显示提示框属性

    最近一直在使用echarts,当然也被其中的各种属性整的头大,记录一下其中遇到的问题. tooltip:鼠标悬浮时显示的提示框. 今天想要记录的是[自定义提示框的内容],如下图,鼠标悬浮时提示框内显示 ...

  3. datagrid 列鼠标悬浮显示全部信息

    首次发表随笔,且是java新手,求不黑,可能在高手眼里好笑,嘿嘿1,样式设置超过字数限制显示省略号:<style type="text/css"> .datagrid- ...

  4. 使用react-tooltip实现鼠标悬浮显示框详细记录

    前段时间遇到的一个需求,要求鼠标悬停显示使用描述, 用到了react-tooltip插件,今天写一个总结 先看效果(为了方便参考,用的是原始样式): 文档参考地址: https://www.npmjs ...

  5. HTML鼠标悬浮显示隐藏 JS方法

    CSS样式表: @charset "utf-8"; /* CSS Document */ .a { width:80px; height:40px; top:200px; left ...

  6. bootstrap-table 内容超出鼠标悬浮显示全部

    .table th, .table td { text-align: center; vertical-align: middle !important; } table { width: 100px ...

  7. JS实现鼠标悬浮,显示内容

    其实就是增加title属性

  8. ZedGraph的曲线的LineItem对象的Tag属性存储信息进而在鼠标悬浮时进行显示

    场景 Winform中设置ZedGraph鼠标悬浮显示距离最近曲线上的点的坐标值和X轴与Y轴的标题: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article ...

  9. asp.net gridview 鼠标悬浮提示信息

    使用场景: gridview绑定数据,某列数据太多,故超过一定字符,隐藏起来,同时鼠标移到指定列显示其明细信息: 知识点: 1,oderListTbl_DataBound事件中,添加,oderList ...

随机推荐

  1. Centos6.5 64linux系统基础优化（二）

    1  操作的最小化原则 1)安装系统最小化 2)开启程序服务最小化原则 3)操作最小化原则 4)登陆最小化原则;平时没有需求不用root登陆,要用普通登陆. 2  更改ssh服务默认端口及常规配置 # ...

  2. Javascript模仿C语言的链表实现（增删改查），并且使用控制台输入输出

    Js新手最近在研究Js数据结构,刚好看到链表实现这一块儿,觉得有些资料和自己理解的有冲突,于是借着自己以前一点点C语言的基础,用Javascript模仿了C的链表实现,并且用了process.stdi ...

  3. js实现一个砖头在页面拖拉效果

    用js实现一个砖头在页面,但鼠标点击拖动时,砖头在页面上形成拖拉效果: 刚开始时: 鼠标点击拖动后: 实现代码: <html>   <head>       <meta ...

  4. 设置contentType

    //定义编码 header( 'Content-Type:text/html;charset=utf-8 '); //Atom header('Content-type: application/at ...

  5. （hdu）1022 Train Problem I 火车进站问题

    题目链接:http://acm.split.hdu.edu.cn/showproblem.php?pid=1022 Problem Description As the new term comes, ...

  6. 第3章文件I/O总结

    1. open和create函数在fcntl.h中,close.lseek.read.write函数在unistd.h中 open函数通过进程有效用户ID判断读文件的权限 可以调用access函数判断 ...

  7. layerX && layerY

    转载:https://developer.mozilla.org/en-US/docs/Web/API/UIEvent/layerX UIEvent.layerX 非标准 这个属性是非标准的属性,并且 ...

  8. linux驱动（一）

    编写模块必须先声明下面两句: #include <linux/module.h>               //这个头文件包含了许多符号与函数的定义,这些符号与函数多与加载模块有关 #i ...

  9. node-webkit：开发桌面+WEB混合型应用的神器

    顾名思义, node -webkit就是 node js+webkit. 这样做的好处显而易见,核心奥义在于,用 node js来进行本地化调用,用webkit来解析和执行HTML+JS. 快速上手 ...

  10. sea.js,spm学习

    安装spm 下载sea.js 运行spm npm install spm@2.x -g npm install spm-build -g 下载sea.js git clone https://gith ...