html - 单元格边框颜色表现怪异

Question

所以我的单元格边框的颜色表现得很奇怪。我已经完成了 border-color:#4A90E2;但颜色在边框中间切换。我已经添加了发生的事情的图像。

我的单元格 ccs 代码是

.tre{
color:black;
width:613px;
height:20px;
position:absolute;
top:180px;
left:-160px;
font-size:40px;
font-family:avenir;
}
.fyra{
background-color:white;
width:463px;
height:51px;
position:absolute;
top:230px;
left:-160px;
border-radius:10px;
border-color:#4A90E2;
display:inline-block;
font-size:30px;
font-family:avenir;
}

我的单元格 php 代码是

<tr> 
    <td class="tre">Efternamn</td>
</tr>
<tr>
   <td> <input class="fyra"type="text" name="efternamn"></td>
</tr> 

我该如何解决这个问题，我希望边框是一种颜色。

---

Fast Snail 的图像。这就是我在框中单击时发生的情况。

Answer 1

使用

border:2px solid #4A90E2;

代替

border-color:#4A90E2;

默认边框样式是 inset 。它看起来像 2 色边框 例子

https://jsfiddle.net/m0p05q25/