Question

我想创建带有一些文本的HTML按钮，并且还想为该按钮添加背景图像。我正在尝试下面的代码，但那不起作用。我已将test.png放在我的www目录

中

<!DOCTYPE html>
<html>
<body>
<input type="button" name="test" value="test" style="background:url('test.png') no-repeat 0 0; width:100px;height=50px;background-color: transparent" ></input>
</body>
</html>

Answer 1

你已经定义了这样的高度height=50px;这是一种错误的语法。

在样式属性中编写css时的正确语法：height:50px;

<强>编辑：

同时检查图像路径是否正确或图像是否存在于给定路径上。

Answer 2

我使用了以下HTML，一切正常。

<input type="button" name="test" value="test" style=" background: url('http://www.training-industry.co.uk/assets/images/Take_Test.png') no-repeat 0 0;
width:130px;
height:130px;
background-color: transparent;" />

看看这个小提琴，并与您的代码进行比较：http://jsfiddle.net/ssqfK/1

Answer 3

尝试background-image而不是background

Answer 4

background:url('test.png') no-repeat 0 0; width:100px; height=50px; background-color: transparent

应该是：

background:transparent url('test.png') no-repeat 0 0; width:100px; height:50px;"

在旁注中，您应尽量避免使用内联样式。

Answer 5

试试这个：

<input type="button" name="test" value="test" style="background:transparent url('test.png') no-repeat 0 0; width:100px;height:50px;" />

另外，要小心高度：50px而不是height = 50px

Html按钮的背景图象

5 个答案: