Antd search input无中框

发现input.search, 搜索图标的左侧有个竖线,不是很好看

把它改掉, 新建一个自己的CSS

javascript 复制代码
.custom-search-input{
    .ant-input-affix-wrapper{
      border-right: none !important;
    }
    .ant-input-group-addon{
      .ant-btn{
        border-left: none !important;
      }
    }
  }

应用

javascript 复制代码
<Search placeholder="input search text" className="custom-search-input"/>

就会发现中间的竖框没有了

如果有帮助到你,能点个赞嘛!!谢谢!!!

相关推荐
一只小阿乐1 天前
react 点击事件注意事项
前端·javascript·react.js·react
一只小阿乐4 天前
前端react 开发 图书列表分页
前端·react.js·react·ant-
lyx_20165 天前
PDF文档导出分页功能实现
react.js·typescript·pdf·react
在未来等你7 天前
AI Agent设计模式 Day 5:Reflexion模式:自我反思与持续改进
设计模式·llm·react·ai agent·plan-and-execute
阿桂有点桂10 天前
React使用笔记(持续更新中)
前端·javascript·react.js·react
在未来等你10 天前
AI Agent设计模式 Day 2:Plan-and-Execute模式:先规划后执行的智能策略
设计模式·llm·react·ai agent·plan-and-execute
在未来等你10 天前
AI Agent设计模式 Day 3:Self-Ask模式:自我提问驱动的推理链
设计模式·llm·react·ai agent·plan-and-execute
在未来等你11 天前
AI Agent设计模式 Day 1:ReAct模式:推理与行动的完美结合
设计模式·llm·react·ai agent·plan-and-execute
写完这行代码打球去12 天前
Umi 数据预加载功能详解
react
Zzzzzxl_14 天前
互联网大厂前端面试实录:HTML5、ES6、Vue/React、工程化与性能优化全覆盖
性能优化·vue·es6·react·html5·前端面试·前端工程化