需求，html底部为地图，上层是各个div

HTML
<body>

   //地图

   <div id='map' id="demo1"></div>

   <div class="middleTop" id="demo2">

   </div>

</body>
css样式

.middleTop {

    width: 100%;

    height: 8%;

    position: absolute;

    top: 1px;

    text-align: center;

    background: #00065b;

}

至此，demo2div就在demo1的上层了。

HTML悬浮div的更多相关文章

  1. CSS鼠标悬浮DIV后显示DIV外的按钮

    昨天写样式遇到个问题,如何让鼠标悬浮DIV后,显示DIV外的按钮,可以点击到按钮. 效果如下: 问题: 在DIV hover时候将按钮设为display: block,这是很直接的想法,但是这有个问题 ...

  2. 在页面左右一个悬浮div兼容IE6 IE7 8 9 Firefox chrome

    在页面左右一个悬浮div兼容IE6 IE7 8 9 Firefox chrome #identifier-pannel { bottom: 345px; margin-left: 512px; pos ...

  3. 简单文本悬浮div提示效果

    <html> <head> <script src="jquery-1.9.1.min.js" type="text/javascript& ...

  4. 鼠标经过，显示悬浮DIV

    属牛人的本命佛是虚空藏菩萨.属牛人可佩戴属牛黄玉本命佛来提升财运,黄玉的金黄色代表蒸蒸日上,而“金黄”也就是“黄金”的到(倒)来,象征着富贵与财气,佩戴可以招财招富贵,同时黄玉亦是希望之石,可带来智慧 ...

  5. jquery插件学习之元素顶部悬浮

    jquery插件的学习: HTML部分及应用 <!DOCTYPE html> <html> <head> <meta charset="utf-8& ...

  6. 网页底部广告悬浮弹窗（css）

    有的单页面需要添加广告等悬浮div. 部分代码: <div class="flex"> 内容.... </div> 主要css代码: .flex{posit ...

  7. 用js触发CSS3-transition过渡动画

    用js触发CSS3-transition过渡动画 经过这几天的工作,让我进一步的了解到CSS3的强大,原本许多需要js才能实现的动画效果,现在通过CSS3就能轻易实现了,但是CSS3也有自身的不足,例 ...

  8. CSS篇

    一.盒子模型: 标准模式和混杂模式(IE).在标准模式下浏览器按照规范呈现页面:在混杂模式下,页面以一种比较宽松的向后兼容的方式显示.混杂模式通常模拟老式浏览器的行为以防止老站点无法工作. CSS盒子 ...

  9. CSS的position/float/display

    一.position position属性取值:static(默认).relative.absolute.fixed.inherit. postision:static:始终处于文档流给予的位置.它可 ...

  10. ArcGIS API for JavaScript开发环境搭建与发布以及基本功能实现

    1.背景介绍 ArcGIS API for JavaScript 咱这就不介绍了,具体可看ESRI中国的介绍:http://support.esrichina.com.cn/2011/0223/960 ...

随机推荐

  1. C语言学习记录（二）

    C语言学习记录(二) 一.知识要点(C语言概述) 1.C语言的发展历史和特点 C语言的发展历史 C语言最早在B语言的基础上开发出来,并于1972年在一台计算机上首次实现. C语言最开始只是为描述和实现 ...

  2. SQLSERVER自动备份数据库

    1. 通过操作系统的定时任务执行 创建两个文件,auto.bat和auto.sql,使用bat调用sql文件中的代码段 auto.bat内容 sqlcmd -S localhost,2433 -U s ...

  3. Win11右键默认显示更多选项的设置

    怎么让Win11右键默认显示更多选项?有很多朋友不喜欢win11系统的右键菜单显示,经常需要多点一次"显示更多选项"才能看到想要的内容,大家想知道如何让win11右键菜单默认显示更 ...

  4. tif文件拼接+转换成netcdf格式

    2022-11-16 11:33 手上有若干个SRTM1V3.0 的高程数据,为HGT格式,需要将其拼接并转换成netcdf格式,以让ncl能够进行读取 步骤: gdal_translate A.hg ...

  5. 【Ubuntu】设置桌面文件夹路径

    Ubuntu 系统会将桌面文件夹路径默认设置为 $HOME/Desktop,包括文档.下载.图片等文件夹路径都有各自的默认路径.若想更改这些文件夹路径,可参考『此链接』. 首先到希望更改的路径下建立桌 ...

  6. 玩玩 Visual Studio Code 和 MSYS2

    注意:为了便于理解本文内容,您可能需要一些前置知识,例如命令行操作,编译器操作,路径操作,环境变量操作,vscode操作-- 众所周知 Visual Studio Code 是一个优秀的编辑器. 众所 ...

  7. 通过xshell在linux上安装nginx1.12.0

    0)环境安装 Nginx是C语言开发,建议在 Linux 上运行,当然,也可以安装 Windows 版本,本篇则使用 CentOS 7 作为安装环境. 0.1 gcc 安装 安装 nginx 需要先将 ...

  8. Django中关于Manager的使用

    首先介绍一下 manager 的使用场景,比如我们有一些表级别的,需要重复使用的功能,都可以使用 manager 来实现. 比如我们在前面的笔记中介绍的 model 的 create().update ...

  9. 简述47种Shader Map的渲染原理与制作方法

    https://mp.weixin.qq.com/s/6EVpmgC53HqklIVkIpEssg

  10. Wps调用dll操作Excel表格转PDF

    起始原因:wps编辑创建的文档在microsoft office 中打开,会报内容存在异常是否恢复,因此wps文件被微软设定为破损文件,无法对原有文档进行操作运行,故在此使用wps对Excel进行操作 ...