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

</style>

</head>

<body>

<!--z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。z-index 仅能在定位元素上奏效（例如 position:absolute;）！-->

<div style='position:relative; width:500px; height:500px;'>

<div style='position:absolute; z-index:2; width:300px; height:300px; left:0px; top:0px; background-color:red;'></div>

<div style='position:absolute; z-index:3; width:200px; height:200px; left:0px; top:0px;background-color:green;''></div>

</div>

</body>

</html>

效果：

div悬浮的更多相关文章

  1. html通过css,js实现div悬浮效果总汇，如原生JS实现滚动到一定位置实现div悬浮

    在我们的实际开发中,经常会遇到页面中需要悬浮效果,比如最早的客服联系,对联悬浮广告等,今天为大家介绍一些如何实现div悬浮的效果. 传统的fixed实现: 通过css中的属性position参数设为f ...

  2. 【CSS】非常简单的css实现div悬浮页面底部

    <div id="demo_div"></div> <style> #demo_div{ left:; position: fixed; bot ...

  3. jquery中div悬浮嵌套按钮效果

    <div class="btn_sure_cai" style="margin-left: 0px;" onmouseover="show_hi ...

  4. div悬浮窗口设计来完成注册页面

    login.jsp页面 <script type="text/javascript" src="js/register.js"></scrip ...

  5. 怎么让一个div 悬浮在另一个div上

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  6. div悬浮在屏幕的中间及点击按钮关闭弹出框

    #fd { position: fixed; z-index: 999; width: 109px; height: 323px; top: 71%; right: 1%; margin: -50px ...

  7. div 悬浮

    一个小需求,鼠标移动一个产品那, 显示这个产品的具体信息 代码如下: <a href="javascript:void(0);" onclick="frameSea ...

  8. 当div有边框图片的时候，怎么实现内部的p标签的水平和垂直居中

    <!-- 这里a.png必须是四边的框都有,限制,这个时候做里边文字的居中,首先在这个里边在套一个div悬浮(absolute或者float:left),然后在这个div(必须设宽高和margi ...

  9. 纯CSS实现带返回顶部右侧悬浮菜单

    这是我做个人网页的时候加上的带返回顶部右侧悬浮菜单效果,如下图, 使用工具是Hbuilder. 代码如下: <!DOCTYPE html> <html> <head> ...

随机推荐

  1. IE10，11下_doPostBack未定义错误的解决方法

    出现的原因 .NET2.0和.NET4.0一起发布的浏览器定义文件中有一个错误,它们保存相当一部分浏览器版本的定义.但是浏览器的有些版本(比如IE10,11)则不再在这个范围之内.因此,ASP.NET ...

  2. solve the problem of 'java web project cannot display verification code'

    my java code of the function: package com.util; import java.awt.Color; import java.awt.Font; import ...

  3. 在JavaScript中，利用三元运算符生成当前日期yyyy-MM-dd

    <script type="text/javascript"> //得到当前时间yyyy-MM-dd var myDate = new Date(); var nowD ...

  4. 蓄水池（Reservoir_sampling）抽样算法简记

    摘要 1.适用场合 2.算法简介 3.代码例子 4.Spark RangePartitioner 中的应用(待补充) 内容 1.适用场合:从包含n个项目的集合S中选取k个样本,其中n为一很大或未知的数 ...

  5. iOS-应用闪退总结

    一.之前上架的 App 在 iOS 9 会闪退问题(iOS系统版本更新,未配置新版本导致闪退问题) 最新更新:(2015.10.02) 开发环境: Delphi 10 Seattle OS X El ...

  6. Jenkins的Windows Slave分布式构建和部署

    1.新建的Slave:系统管理-->管理节点-->新建节点 远程工作目录 即是 节点服务器 站点文件存放目录 在配置节点时 启动方法 配置的选项中的 Launch agent via Ja ...

  7. Transaction Replication6：Transaction cleanup

    distribution中暂存的Transactions和Commands必须及时cleanup,否则,distribution size会一直增长,最终导致数据更新耗时增加,影响replicatio ...

  8. 前端：圆图头像制作--border-radius : 100%

    异常处理汇总-前端系列 http://www.cnblogs.com/dunitian/p/4523015.html border-radius : 100% border-radius: 6px; ...

  9. HTML5系列：HTML5表单

    1. input元素新增类型 url类型 url类型的input元素是一种用来输入url的文本框,提交时如果该文本框中内容不是url格式,则不允许提交. <input type="ur ...

  10. Bower : ENOGIT git is not installed or not in the PATH

    解决方法一: 添加git到window的环境变量中.设置path路径为C:\Program Files\Git\bin 解决方法二: $ set PATH=%PATH%;C:\Program File ...