（1）
方法：设置div样式 z-index:auto
auto可定义为一个值(整数数字)，越大代表越置前，如可定义为： z-index:999。
前提是div是定位元素。（2）可以使用float元素进行实现该效果。代码实例如下：
<html><body><styletype="text/css">.div1{ width: 200px; height: 100px; background: red; float: left; }.div2{ width: 300px; height: 350px; background: yellow; }</style><divclass="div1"></div><divclass="div2"></div></body></html>效果如下：
例子代码：
<div style="width:600px;height:300px;float:left; z-index:999;position:absolute;margin-left: 400px;">
<div class="col-lg-12">
<div class="form-panel">
<h4 class="mb"><i class="fa"></i> 修改新闻类别信息</h4>
<form class="form-horizontal style-form" method="post" id="newstypeForm" name="newstypeForm">
<div class="form-group">
<label class="col-sm-2 col-sm-2 control-label">类型名称：</label>
<div class="col-sm-10">
<input type="text" class="form-control" id="typename" name="typename">
<span class="help-block">A block of help text that breaks onto a new line and may extend beyond one line.</span>
</div>
</div>
<div class="form-group">
<label class="col-sm-2 col-sm-2 control-label">类型总量：</label>
<div class="col-sm-10">
<input class="form-control" id="disabledInput" type="text" placeholder="0" disabled>
</div>
</div>
<button type="button" class="btn btn-round btn-primary" "addNewstype()" >确定</button>
<button type="button" class="btn btn-round btn-default" "clearButton()">重置</button>
</form>
</div></div>
</div><div class="col-md-12" ></div>
被覆盖div定属性 position:relative;
上面div定位属性 position:absolute<div> <div style="position: absolute;">标题</div> <div style="position: relative;">此处显示canvas地图</div> </div>
展开全部
html 让其中一个div浮在另一个div上面 通常情况下，有两种实现方法：(1) 浮动62616964757a686964616fe4b893e5b19e31333366306461的元素设置float属性 (2) 浮动的元素设置position属性为 absolute, 另一个元素设置position属性为 relative。
具体实现代码如下:
1、设置float属性
.dom1 { position: relative; width: 150px; height: 150px; background: #00f; }
.dom2 { position: absolute; top: 0;width: 100px; height: 100px; background: #999; }
运行结果为:
2、浮动的元素设置position属性为 absolute, 另一个元素设置position属性为 relative
.dom1 { position: relative; width: 150px; height: 150px; background: #00f; }
.dom2 { position: absolute; top: 0;width: 100px; height: 100px; background: #999; }
运行结果为:
扩展资料:
CSS float的作用:
Float浮动用于设置对象靠左与靠右浮动样式，可以实现我们所需要的让DIV、SPAN等标签居左居右浮动。
代码示例如下:
.divcss5{ width:400px;padding:10px;border:1px solid #F00}
.divcss5_left{ float:left;width:150px;border:1px solid #00F;height:50px}
.divcss5_right{ float:right;width:150px;border:1px solid #00F;height:50px}
.clear{ clear:both}
布局靠左浮动布局靠右浮动
运行效果为:
直接上DEMO了
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <style type="text/css"> <!-- .d1 { position:absolute; top:20px; left:20px; width:200px; height:200px; background:red } .d2 { width:500px; height:100px; background:blue; } --> </style> <div class="d1"></div> <div class="d2"></div>转载于:https://www.cnblogs.com/linuxnewbie/p/4789309.html
