图像精灵 - 表单提交按钮

时间:2013-03-28 17:43:03

标签: image forms sprite

我可以将图片精灵用于我的表单提交按钮,尝试了一些但似乎没有任何工作。

.button, .download, .OK, .file{
background: url(app/sprites.png) no-repeat;
 }


.button{
background-position: -1px -212px ;
width: 170px;
height: 30px;
}

我的表格

 <form action="add.php" method="post"  value="Username">
 <div style="float:left; margin-left:15px;"><input type="text" name="fbid" required></div>
<div style="float:left; margin-left:2px;"><input type="submit" value="Submit"></form>

2 个答案:

答案 0 :(得分:2)

现在你在输入上缺少一个类。

<input type="submit" class="button" value="Submit">

这样就可以了。

我把它放到jsFiddle中,使用不同的图像因为我无法访问你的图像。你可以玩32px的位置玩这个位置。

jsfiddle.net/CzWCv

答案 1 :(得分:0)

你试过吗

<div class="button" style="float:left; margin-left:2px;"><input type="submit"
value="Submit"></form>

...