下面的div
显示错误消息现在我想添加一个出现在错误消息之前的图像。它只是一个小错误图像,我希望它出现在div
的左侧,以便它出现在错误文本之前。我试图用背景图像做现在文本是重叠图像,因为图像是文本的背景。有没有任何方法可以在图像后面显示错误消息而不是重叠。
<div id='er'><?php echo $er; ?></div>
<style>
#er{font-size: 14px;color:blue; background: url(img_stop.gif);
background-size: 35px 35px;
background-repeat: no-repeat;}
</style>
答案 0 :(得分:2)
像这样JS Fiddle
#er{
font-size: 14px;
color:blue;
min-height:45px; /* so that the image will always be shown even for short error messages */
background: transparent url(http://www.willowsigns.com/images/products/reflective-stop-sign-circular-icon-600mm-dia-Ehwf.png) no-repeat;
background-position: 5px center; /* image positioned 5px of the 0 left and centered top */
background-size: 35px 35px;
border:1px solid red;
padding:5px 5px 5px 45px; /*giving left padding as 45, 35px for the image, and 5px on each side */
}
&#13;
<div id='er'>
Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores soluta accusamus dolorum ut odit voluptatem, autem sint!
</div>
&#13;