我想将背景图像添加到“提交”按钮中。我添加了图片,但是当我这样做时no-repeat
背景图像消失了!为了避免丢失图像该怎么办?
的HTML
<div class="comtextarea">
<textarea name="comment" class="comment" maxlength="200" id="" rows="2" cols="50"></textarea>
<input type="submit" value="" class="combut"/>
</div>
的CSS
.comtextarea {
float:left;
width:550px;
height:auto;
}
.comment {
width:550px;
resize:none;
outline:none;
border:1px solid #abc7d0;
}
.combut {
float:right;
margin-top:-36px;
z-inde:3;
position:relative;
outline:none;
width:30px;
height:30px;
background-image:url(https://scontent-a-fra.xx.fbcdn.net/hphotos-frc1/t1.0-9/10291103_828742610487379_816788942451910142_n.jpg) no-repeat;
padding:0px 0 4px 0; border:none;
text-indent:-10000em;
}
这是DEMO页面
这是因为您将其设置为针对属性background-image
。
该background-image
属性仅用于指定背景图像值,没有其他与背景相关的属性。
将其更改为background
。
或具有2个单独的属性:
background-image: url(..URL HERE..);
background-repeat: no-repeat;
我个人更喜欢2个独立的属性。可以清楚地看到no-repeat
所应用的值,并且在源代码管理更改下更易于管理。
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句