html和css中的无边框文本输入[duplicate]

ybzsozfc 于 2023-01-28 发布在其他

关注(0)|答案(1)|浏览(136)

- 此问题在此处已有答案**：

How to remove focus border (outline) around text/input boxes? (Chrome) [duplicate]（11个答案）
3天前关闭。
我试着在HTML和CSS中输入无边框的文本，我已经成功地做到了，但是每当我点击输入字段时，它会出现一个新的黄色边框来代替我去掉的边框。我假设这是默认的样式表，但我似乎无法覆盖它。

div.field input {
  width: 65%;
  height: 30px;
  border-top: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
}

<div class="field">
  <input type="text" placeholder="Username" name="user">
</div>

Html

来源：https://stackoverflow.com/questions/75224997/borderless-text-input-in-html-and-css

1条答案

按热度按时间

ws51t4hk1#

只需将css大纲属性设置为none，
像这样

div.field input {
    width: 65%;
    height: 30px;
    border-top: 0 !important;
    border-left: 0 !important;
    border-right: 0 !important;
    outline:none;
}

<div class="field">
   <input type="text" placeholder="Username" name="user">
</div>

赞(0）回复(0）举报 2023-01-28

我来回答

html和css中的无边框文本输入[duplicate]

1条答案

相关问题

热门标签

最新问答