html - 在输入选择器上只显示一个边框？

Question

我试图创建一个只有一个边框(即 border-left)的输入框，但每次我将 border-left 放入选择器时，顶部、右侧、底部边框都会出现(带有斜 Angular 和浮雕外观)。这是我现在拥有的。

HTML

<input type="text" id="fullname" class="detail" name="fullname" value="" />

CSS

.detail {
    border-left: 1px #fff solid;
    background: transparent;
    width: 490px;
    height: 30px;
    padding-left: 10px;
}

这是我的 JSFiddle:http://jsfiddle.net/XRFB3/

Answer 1

首先设置默认边框:

.detail {
    border:0;
    border-left: 1px #fff solid;
    background: transparent;
    width: 490px;
    height: 30px;
    padding-left: 10px;
}

JSFiddle