如果我使用类，css将无法正确应用于输入标记

a1o7rhls 于 2023-01-06 发布在其他

关注(0)|答案(2)|浏览(132)

我试图自定义我的输入表单，但奇怪的事情发生了，我不明白为什么会发生。
下面是我的HTML：

<input type="text" class="multi-choice" >
<input type="text" class="multi-choice" >
<input type="text" class="multi-choice" >

如您所见，我有三个input元素，它们都有一个"multi-choice"类。
这是我为测试而做的CSS：

.multi-choice {
background-color: red;
height: 400px;
width: 10px;
border: 10px solid black;
outline: none;

}
现在的情况是CSS只应用在背景色和高度上，导致了巨大的红色输入栏，但是它完全忽略了宽度、边框和轮廓。
当我用id代替class做同样的事情时，它是正确的，为什么会这样呢？
编辑
根据答案的代码工作，所以我假设这是我的个人电脑上的东西，是阻止它的工作不知何故。

2条答案

我想你的html和css一切都很好。也许你不能实现你的边界，因为你没有给不同的颜色

.multi-choice {
background-color: red;
height: 200px;
width: 200px;
border: 10px solid black;
outline: none;
}

<input type="text" class="multi-choice" >
<input type="text" class="multi-choice" >
<input type="text" class="multi-choice" >

边框指令要求更高，光说10px不够。

border: 10px solid black;

会更好的工作。