首頁  >  文章  >  web前端  >  html怎麼設定圖片按鈕

html怎麼設定圖片按鈕

藏色散人
藏色散人原創
2021-06-03 15:28:368561瀏覽

html設定圖片按鈕的方法:先建立一個HTML範例檔案;然後透過button標籤建立一個按鈕;最後透過background屬性設定圖片即可。

html怎麼設定圖片按鈕

本文操作環境:windows7系統、HTML5&&CSS3版、Dell G3電腦。

html中把圖片變成按鈕

程式碼如下:

<input type="image">
<input type="submit" style="background: url(&#39;图&#39;) no-repeat;">
<input type="button" style="background: url(&#39;图&#39;) no-repeat;" οnclick="提交的js">
<button style="background: url(&#39;图&#39;) no-repeat;" οnclick="提交的js">文字</button>
<img  src="图" οnclick="提交的js" alt="html怎麼設定圖片按鈕" >
<span style="border:1px solid #000000;background: url(&#39;图&#39;) no-repeat;" οnclick="提交的js"> </span>

相關介紹:

標籤用於蒐集用戶資料。

根據不同的 type 屬性值,輸入欄位擁有很多種形式。輸入欄位可以是文字欄位、複選框、遮罩後的文字控制項、單選按鈕、按鈕等等。

background 簡寫屬性在一個宣告中設定所有的背景屬性。

可以設定如下屬性:

background-color

background-position

background-size

background-repeat

#background-origin

background-clip

background-attachment

background-image

##如果不設定其中的某個值,也不會出問題,例如background:#ff0000 url('smiley.gif'); 也是允許的。

通常建議使用這個屬性,而不是分別使用單一屬性,因為這個屬性在較老的瀏覽器中能夠得到更好的支持,而且需要鍵入的字母也更少。

html怎麼設定圖片按鈕

【推薦學習:

html影片教學

以上是html怎麼設定圖片按鈕的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn