顶部输入标签深色

Question

这是我的HTML代码：

<input type="text" placeholder="Email address" style="width:290px;border-radius:5px;">

相当简单的HTML代码。这是JFiddle：

https://jsfiddle.net/tLfpjL4a/

正如你所看到的，由于某些原因，顶部的一部分是黑暗的，不知道为什么。

我尝试了以下css功能：

border-style和border-color

但它没有真正起作用

Answer 1

您需要覆盖border样式：

.input-block-level {
  border: none;
}

jsFiddle Demo

如果您更喜欢使用内联样式，只需在代码中添加border: none：

<input type="text" class="input-block-level" placeholder="Email address" style="width:290px;border-radius:5px;border:none" />

Answer 2

使用border: none;：

input {
  border: none;
}

JSFiddle

CSS border property on MDN

Answer 3

那是因为你没有指定全范围的边框选项。只需添加border-style: solid即可获得平坦的边框。

Answer 4

Border property请注意，它会占用所有边框，因此您可能需要设置属性，否则它将最终为空。所以可能是这样的。

<input type="text" class="input-block-level" placeholder="Email address" style="width:290px;border-radius:5px;border: 1px solid #B5B6B7;padding: 5px" />

我添加了填充，因为它使输入框看起来更漂亮，用户界面更友好

小提琴：https://jsfiddle.net/tLfpjL4a/5/

如果您愿意，可以添加：

* {
  outline: none;
}

将删除当事物处于活动状态并在焦点上选择时显示的默认浏览器大纲

Answer 5

您可以尝试使用以下CSS属性作为输入字段。

  

border-style：none

Answer 6

你可以使用：

• border: 0;
• border: none
• border:1px solid white;

<强> JSFIDDLE DEMO

Answer 7

你使用的是没有边框的类。

＆＃13;

＆＃13;

.input-block-level
{
  border:none;
}

＆＃13;

＆＃13;

＆＃13;