div居中鼠标悬浮显示下拉列表
<!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居中鼠标悬浮显示下拉列表的更多相关文章
- Winform中设置ZedGraph鼠标悬浮显示举例最近曲线上的点的坐标值和X轴与Y轴的标题
场景 Winform中设置ZedGraph鼠标双击获取距离最近曲线上的点的坐标值: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/ ...
- echarts —— tooltip 鼠标悬浮显示提示框属性
最近一直在使用echarts,当然也被其中的各种属性整的头大,记录一下其中遇到的问题. tooltip:鼠标悬浮时显示的提示框. 今天想要记录的是[自定义提示框的内容],如下图,鼠标悬浮时提示框内显示 ...
- datagrid 列鼠标悬浮显示全部信息
首次发表随笔,且是java新手,求不黑,可能在高手眼里好笑,嘿嘿1,样式设置超过字数限制显示省略号:<style type="text/css"> .datagrid- ...
- 使用react-tooltip实现鼠标悬浮显示框详细记录
前段时间遇到的一个需求,要求鼠标悬停显示使用描述, 用到了react-tooltip插件,今天写一个总结 先看效果(为了方便参考,用的是原始样式): 文档参考地址: https://www.npmjs ...
- HTML鼠标悬浮显示隐藏 JS方法
CSS样式表: @charset "utf-8"; /* CSS Document */ .a { width:80px; height:40px; top:200px; left ...
- bootstrap-table 内容超出鼠标悬浮显示全部
.table th, .table td { text-align: center; vertical-align: middle !important; } table { width: 100px ...
- JS实现鼠标悬浮,显示内容
其实就是增加title属性
- ZedGraph的曲线的LineItem对象的Tag属性存储信息进而在鼠标悬浮时进行显示
场景 Winform中设置ZedGraph鼠标悬浮显示距离最近曲线上的点的坐标值和X轴与Y轴的标题: https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article ...
- asp.net gridview 鼠标悬浮提示信息
使用场景: gridview绑定数据,某列数据太多,故超过一定字符,隐藏起来,同时鼠标移到指定列显示其明细信息: 知识点: 1,oderListTbl_DataBound事件中,添加,oderList ...
随机推荐
- android studio环境搭建-笔记1
自己干了几年测试(功能性的),最近比较闲,就自己学习下android(以前也有所接触,但那是几年前的一点皮毛,都忘记了). 先搭建谷歌推出的android studio(以前用eclipse搭建总觉得 ...
- ACM——简单排序
简单选择排序 时间限制(普通/Java):1000MS/3000MS 运行内存限制:65536KByte总提交:836 测试通过:259 描述 给定输入排序元素 ...
- 二维码QRCode
package com.aig.ecompass.ecard; import java.awt.image.BufferedImage; import java.io.File; import jav ...
- php常用正则表达式函数
执行一个正则表达式匹配: preg_match($pattern, $subject, [array &$matches]); 最多匹配一次,返回值0或1,把第一次匹配到的结果放入$match ...
- Java_Web学习笔记_过滤器应用案例(解决全站字符乱码)
解决全站字符乱码(POST和GET中文编码问题) servlet: l POST:request.setCharacterEncoding(“utf-8”); l GET: String user ...
- Ext.Net学习笔记04:Ext.Net布局
ExtJS中的布局功能很强大,常用的布局有border.accordion.fit.hbox.vbox等,Ext.Net除了将这些布局进行封装以外,更是对border进行了一些非常实用的改进,让我们来 ...
- Http上传文件
public class UpLoadFile { public static void UpLoadFiles(string fileName) { string fileType = Path.G ...
- MFC Tips(一) 在程序内部 保存读取配置
//保存 CWinApp *pApp = AfxGetApp(); pApp->WriteProfileBinary(..); //保存结构体 pApp->WriteProfileInt( ...
- C++ 数组的地址问题学习随笔
二维数组额地址问题学习,本文学习内容参考:http://blog.csdn.net/wwdlk/article/details/6322439 #include<iostream> usi ...
- vim 配置文件 ,高亮+自动缩进+行号+折叠+优化
vim 配置文件 ,高亮+自动缩进+行号+折叠+优化 将一下代码copy到 用户目录下 新建文件为 .vimrc保存即可生效: 如果想所有用户生效 请修改 /etc/vimrc (建议先cp一份)& ...