我想添加一个与div标签重叠的div标签,并在重叠的div标签上添加一个文本。这是代码。 。请帮忙。
.center_prod_box{
border-radius: 15px;
width:190px;
height: 260px;
float:left;
text-align:center;
padding:0px 0px 5px; 0;
margin:0px 5px 0px 0;
border:1px #000000 solid;
}
.product_title{
background:#cdf895;
border-radius: 15px;
textalign:center;
font-size:12px;
margin: 7px 5px;
font-weight:bold;
color:#ffffff;
padding:5px 5px 5px 15px;
}
<div class="center_prod_box">
<img src="images/offer2.png" style="position:absolute; margin-left:50px; margin-top:-10px;" alt="" border="0" width="60" height="60" Title="Amul Butter" />
<div class="offertext" style=" position:absolute; margin-left:0px;">Hello</div>
<a href="" Title="Amul Butter">Amul Butter</a>
</div>
答案 0 :(得分:6)
为此,您可以将position: absolute;
用于重叠div
。并将任何文本添加到该div。
这将是这样的:
<div style="position: relative;">
<div style="position: absolute;">
The text to be added, will be written here! :)
</div>
</div>
您可以使用class
或id
来设置它们的样式!在您的图片中,您也使用position: absolute;
作为图片代码。如果要将文本放在该图像上,请使用position: relative;
。或者你可以使用z-index
来将它们放在另一个上面!
编辑:文字对齐是IE7中的错误:http://haslayout.net/css/Text-Align-Bug
答案 1 :(得分:0)
您想将div
与offertext
类放在页面的其他位置吗?此外,最好摆脱所有内联css,最后一个</div>
太多了。