制作一个带背景的按钮答案

【问题标题】：Make a button with background制作一个带背景的按钮
【发布时间】：2014-04-14 00:39:38
【问题描述】：

我想制作一个带有标志作为背景的 html 按钮。所以在文件夹 images 中有一张名为 langnl.jpg 的图片。我的代码：

HTML：

<button id="taal" onclick="changelangde()" >DE</button>

CSS：

#taal{
background-image:images/langde.jpg; 
}

但它不起作用，按钮只保留默认颜色。我尝试了几种链接图像的选项，但没有一个有效。如果我只插入带有 img-tag 的图像，它就可以正常工作。

【问题讨论】：

【解决方案1】：

你可以这样做：

#taal{
    background: url('images/langde.jpg') no-repeat top left;
    background-size:contain;
}

或者这个：

#taal{
    background: url('images/langde.jpg') no-repeat top left;
    background-size:100% 100%;
}

看你想要什么，可以看例子here。

【讨论】：

【解决方案2】：

试试

#taal{
 background: url('images/langde.jpg') no-repeat top left;
 width:200px;
 height:100px;
 }

【讨论】：

【解决方案3】：

将images/langde.jpg; 更改为url(images/langde.jpg);

#taal{
background-image:url('images/langde.jpg'); 
background-size:cover;
}

【讨论】：