CSS按钮样式值

如果我有这行代码：CSS按钮样式值

<input type="submit" class="mybutton" name="add" value="Add new"/>

如何使用CSS样式的按钮值？我需要添加图像它的价值之前，因此我需要这行代码的值输出：

<span class="add">Add new</span>

我尝试喜欢的东西：

<input type="submit" class="mybutton" name="add" value=""> 
<span class="add">Add new</span></input>

哈哈，不过这完全没有按没有任何意义。

任何人都是一个很好的小费？

编辑

哇感谢伟大的快速响应。忘了提及我使用“sexybuttons”的.CSS文件，所以我无法改变样式，需要其他方法。

<button type="submit">

是我在找的东西。非常感谢。

来源

2012-11-21 Ivan M

您可以尝试使用button标记而不是input。

<button type="submit" class="mybutton" name="add"> 
    <img src="path_to_image"> 
    <span class="add">Add new</span> 
</button>

或者您可以为使用CSS的按钮设置一个background-image。

来源

2012-11-21 09:07:15 Henrik

如果在HTML表单中使用'

<input type="submit" class="mybutton" name="add" value="Add new"/>

然后添加一个CSS

.mybutton{ 
    // use css background attributes 
    background:transaparent url(//image); 
}

来源

2012-11-21 09:07:29

您可以使用CSS设置背景图像并应用到像这样的按钮：

CSS：

input[type=button],input[type=submit],button{ 
    background:url(images/btn-verzend.jpg) no-repeat; 
    width:91px; 
    height:35px; 
    line-height:35px; 
    border:none; 
    color:#FFF; 
    cursor:pointer; 
}

html：

<input type="submit" name="add" value="Send" /> 
<input type="button" name="add" value="Send" /> 
<button>Send</button>

这对我有效。

来源

2012-11-21 09:08:33 RTB

我希望你看这个...........

DEMO

HTML

<input type="submit" class="mybutton" name="add" value=""/>

CSS

.mybutton { 
background: url(http://coursesandevents.anjaschuetz.net/wp-content/uploads/2010/01/submit_button_large_red.jpg) no-repeat 0 0; 
    width:248px; 
    height:262px; 
    border:none; 
}

来源

2012-11-21 09:08:39

尝试：

<button type="submit" class="mybutton" name="add" value=""> 
    <span class="add">Add new</span> 
</button>

fiddle

来源

2012-11-21 09:09:40 Roman

<input type="submit" class="mybutton" name="add" value="Add new"/> 

.mybutton{ 
background:url(image.jpg)no-repeat; 
height:12px; 
width:12px; 
color:#fff; 
border:none 
}

来源

2012-11-21 09:10:01 james

HTML

<input type="submit" class="mybutton" name="add" value="Add New" />

CSS

input{ 
    background:#58D3F7 url(http://png-1.findicons.com/files/icons/1580/devine_icons_part_2/128/home.png) no-repeat left; 
    background-size:20px; 
    padding:10px 25px; 
    text-align:center; 
    border:none; border-radius:3px; cursor:pointer 

}

DEMO

来源

2012-11-21 09:10:25 Sowmya

你也可以这样做：

<span id="addSubmitButton" class="add" class="mybutton">Add new</span>

然后将其添加到CSS：

.mybutton:before{ 
content:"url(image.jpg)"; 
}

，或者你可以使用jQuery做到这一点不改变原来的代码如下所示：

$("#addSubmitButton").before("<img src='image.jpg' alt='image'/>");

来源

2012-11-21 09:16:39 ninjacoder

CSS按钮样式值

回答

相关问题