Question

所以我有以下内容：

paper-button{
  color: red;
  background-color: blue;
}
paper-button:hover{
  color: blue;
  background-color: red;
}

无论如何，按钮文本正确显示为红色，当悬停时，文本正确显示蓝色，背景正确显示红色，但是当它没有悬停时，它是白色，而不是蓝色。我也试过了：

 --paper-button-background: blue;

和

  background-color: blue;

没有成功。按钮如下：

 <paper-button raised noink>raised</paper-button>

为什么我不能设置background-color的样式？

更新

因此，当我添加一个类并选择该类而不是选择所有纸张按钮时，它会起作用，但它会删除文本（或使其成为背景颜色），但只有当我添加类css代码时才会这样做也没有课程从纸张按钮中删除文本，这更令人困惑...当我删除只选择正确类的纸质按钮的代码时，没有该类的纸质按钮没有删除的文本错误。

Answer 1

您将创建css类，您可以使用此css 像这样

＆＃13;

.paper-button{
  color: red;
  background: blue;
  padding:16px 32px;
}
.paper-button:hover{
  color: blue;
  background: red;
   padding:16px 32px;
}

＆＃13;

<input type="button" class="paper-button" >

＆＃13;

Answer 2

好的，这是一个愚蠢的答案，但我找到了。你必须像这样在html中嵌入css：

 <style is="custom-style"> </style>

您不能拥有单独的样式表：

<link rel="stylesheet" href="styles.css">

我不知道为什么你不能将is="custom style"添加到链接表中，但这就是解决方案。

Answer 3

将背景颜色更改为背景。

.paper-button{
  color: red;
  background: blue;
}
.paper-button:hover{
  color: blue;
  background: red;
}

<input type="button" class="paper-button" value ="click">

Answer 4

paper-button{
  color: red;
  background: blue;
  padding:16px 32px;
}
paper-button:hover{
  color: blue;
  background: red;
   padding:16px 32px;
}

<paper-button raised noink>raised</paper-button>

不能改变聚合物纸按钮的背景颜色

4 个答案: