Javascript 如何应用CSS输入？

我一直在用HTML/CSS/JS构建这个温度计转换器项目

我对我的输入应用了一些CSS，但由于某些原因它没有应用

字段应该被拉伸以适合我已经设置的33.33vh div的宽度和高度

这是小提琴

---

选择器中有一个空格。它应该是

input[type=number]

。在CSS中，选择器

input[type=number]

意味着“任何元素，它是

的后代，并且有一个属性

type

和值

number

（请参阅）

您可能希望使用选择器

input[type=number]

（注意没有空格），这意味着“任何

元素，其属性

type

的值为

number

”

此外，我建议使用或属性更简洁地标识元素：

#温度计{…}

…或：

温度计{…}

欢迎来到堆栈溢出。请复习，看看如何提出一个好问题，并且你的问题要包括所有相关的代码。外部链接是可以的，但只有当相关代码也包含在这里时，因为链接可能会随着时间的推移而中断或更改，并使您的问题对其他用户的用处降低。您的问题相当模糊。你为什么不给特定的输入应用一个类或id，然后在你的CSS中相应地应用你的CSS。thermo{这里所有的样式}我确实应用了一个id，因为有3个不同的id，但它们都共享相同的输入类类型。同样，100%的填充会给你带来问题..你应用的id是包含的div，不是输入本身。请让你知道如何在这里参与。肯定是在IDs之前的可重用类。不，不一定。我同意，有一个共同的约定，即优先使用类而不是ID，但它们是用于不同明确定义目的的不同工具。在这种情况下，如果只有一个温度计，那么我会使用ID；否则-类。我仍然使用类。你几乎不知道你再也不会需要它了，使用ID不必要地限制使用开发是不明智的。而且，很可能其他人出于功能目的需要更改ID并破坏你的样式。让我们不要开始一场圣战。我只是说“了解你的工具”，没别的。

input [type=number] {
  width: 100%;
  height: 100%;
  background: black;
  color: white;
  font-family: Poppins, sans-serif;
  font-size: 10em;
  text-align: center;
  border: 0;
  padding: 100%;
}