html - 需要从搜索栏中删除边框

Question

所以当我不点击它时我有搜索栏，它如下图所示

但是一旦我输入一些东西，就会出现一个蓝色边框，但我不想要它而且我不知道如何删除它

这是css文件

body{
    background: whitesmoke;
}
.header{
    display: flex;
    /* width:50%; */
    align-items:center;
    justify-content: space-around;
    border-bottom: 1px solid whitesmoke;
}

.header-middle {
    display:flex;
    flex:0.5;
    align-items: center;
    background-color: white;
    padding: 5px;
    margin-top: 10px;
    border-radius: 10px;
}

.header-middle > .MuiSvgIcon-root {
    color: grey;
    background: transparent;
}

.header-middle > input {
    border:none;
    width:100%;
    padding:10px;
    outline-width: 0;
    font-size: medium;
    background-color: white;
  }

这是 github 存储库：github 存储库

标签： htmlcssreactjs

Answer 1

供您输入使用

input {
    border: none;
    outline: none;
}