站長(zhǎng)資訊網(wǎng)
css中可利用background-image屬性實(shí)現(xiàn)圖片按鈕效果，寫法為“按鈕元素{background-image:url(圖片路徑)}”；background-image屬性用于設(shè)置元素背景圖像，利用該屬性給按鈕元素添加背景圖片即可。
本教程操作環(huán)境：windows10系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css圖片按鈕代碼怎么寫
在css中，我們可以利用background-image屬性來設(shè)置圖片按鈕，background-image用于設(shè)置元素的背景圖像。
只需要給按鈕元素添加background-image:url(圖片路徑)樣式即可。
下面我們通過示例來看一下具體操作，示例如下：
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>Document</title> <style> button{ width:200px; height:100px; border-radius:20px; border:1px solid #000000; background-image:url(1118.02.png); } </style> </head> <body> <button></button> </body> </html>
輸出結(jié)果：
（學(xué)習(xí)視頻分享：css視頻教程）
