【发布时间】：2018-12-24 14:42:35
【问题描述】：
我将边框设置为 0，将边框样式设置为无，但我的输入周围仍有边框。更奇怪的是；当我添加边框时，原始边框出现在我创建的边框上方。这可能是因为我所有输入的大小都小于 4，但无论如何我都想删除它，或者至少设置一个一致的颜色，如果无法删除 og 边框
我将边框设置为 0 我将边框样式设置为无 我将边框颜色设置为白色（由于某种原因弄乱了很多东西）
<div class="time-container" align="center">
<div id="start" align="middle">
<h2 class="start-time">start</h2>
<div class="time">
<form class="hour">
<input type="text" size="3" maxlength="3" placeholder="hr">
</form>
:
<form class="min">
<input type="text" size="3" maxlength="2" placeholder="min">
</form>
:
<form class="sec">
<input type="text" size="3" maxlength="2" placeholder="sec">
</form>
</div>
<h3></h3>
</div>
<div class="hyphen">
-
</div>
<div id="stop" align="middle">
<h2 class="end-time">end</h2>
<div class="time">
<form class="hour">
<input type="text" size="3" maxlength="3" placeholder="hr">
</form>
:
<form class="min">
<input type="text" size="3" maxlength="2" placeholder="min">
</form>
:
<form class="sec">
<input type="text" size="3" maxlength="2" placeholder="sec">
</form>
</div>
<h3></h3>
</div>
</div>
h2 {
margin-top: 20px;
border-bottom: 2px solid #ccc;
padding-bottom: 5px;
text-align: left;
color: gray;
font-size: 16px;
font-weight: normal;
width: 131px;
}
.min, .sec, .hour {
font-family: 'Roboto', sans-serif;
width: 33px;
box-sizing: border-box;
border: 4px solid #ccc;
font-size: 16px;
margin: 0;
padding: 0;
background: white;
display: inline-block;
}
h3{
border-top: 2px solid #ccc;
width: 131px;
}
.time-container {
display: flex;
width: 100%;
align-self: center;
justify-content: center;
}
.hyphen {
color: #ccc;
font-family: 'Roboto', sans-serif;
font-size: 20px;
font-weight: bold;
align-self: center;
margin: 0 5%;
padding-top: 20px;
}
这是输入边框设置为 4px 的代码。您可以看到原始边框（我找不到删除方法）显示在我的自定义边框上方。 p.s.我希望完全没有边界，我只是展示了border: 4px; 示例以更好地说明这个问题。
【问题讨论】：
-
可能是因为您在
<form>包装器上设置边框，而不是在<input>上。顺便说一句，将每个表单元素包装在不同的<form>中可能不是您想要的。