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按鈕樣式值

回答

相關問題