Você está aqui: CSS ::: Dicas & Truques ::: Cores de Fundo e Imagens de Fundo |
Como definir uma imagem de fundo para um botão HTML usando a propriedade background-image do CSSQuantidade de visualizações: 9582 vezes |
Nesta dica mostrarei como podemos usar a propriedade background-image do CSS para aplicar uma imagem de fundo a elemento <button> do HTML. Vamos ver duas abordagens. Na primeira abordagem usaremos CSS inline. Veja:---------------------------------------------------------------------- Precisa de ajuda? Chama no WhatsApp +55 (62) 98553-6711 (Osmar) Este código foi útil? Paga um cafezinho pra mim :-( PIX: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- <!doctype html> <html> <head> <title>Estudos CSS</title> </head> <body> <button style="background-image: url('fundo.jpg')"> Clique aqui</button> </body> </html> Agora veja a mesma técnica usando um bloco CSS na seção <head> da página HTML e definindo um id para o botão: ---------------------------------------------------------------------- Precisa de ajuda? Chama no WhatsApp +55 (62) 98553-6711 (Osmar) Este código foi útil? Paga um cafezinho pra mim :-( PIX: osmar@arquivodecodigos.com.br ---------------------------------------------------------------------- <!doctype html> <html> <head> <title>Estudos CSS</title> <style> #botao{ background-image: url('fundo.jpg'); } </style> </head> <body> <button id="botao">Clique aqui</button> </body> </html> |
![]() |
Veja mais Dicas e truques de CSS |
Dicas e truques de outras linguagens |
E-Books em PDF |
||||
|
||||
|
||||
Linguagens Mais Populares |
||||
1º lugar: Java |