css如何设置能让一个div元素覆盖在div元素上后下面的div元素中的文字不显示出来


假设上面div的class为two,下面div的class为one。

1、下面的则敏div文字的颜色设置成transparent。

.one{

color:transparent;

}

2、给上面的div设置背缓悔景色。

.two{

background-color: fff;

}

扩展资料:

两个div重合的方法:

父级元素绝对定扰盯正位,子级元素相对定位。通过left、right、top、bottom实现子级在父级内任意定位

假设父级元素的class为con,子级元素的class为two。

.con{

position: relative;

}

.two{

position: absolute;

top:0;

}


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

<body>
   <div style="height:50px; width:300px; background-color:#CCC;">div1中的文字将会被div2覆盖</div>
  搜桐 <div style="height:50px; width:300px; background-color:#0C9; ">div2</div>
   <br />
  你要的是不是把上面转化为下面这个效果<br />
   <div style="height:50px; width:300px; background-color:#999; position:absolute">div1</div>
   <div style="height:50px; width:300px; background-color:#0C9; position:relative">div2</div>
</body>
</html>

效果图:

通过扰御你的表述,我只能这么理解


用position:relative; z-index:1定位,背景设置颜色(白色)
上面的div加个背景把下面的遮挡住
给个背景颜色#ffffff,或者设置不透明