javascript - 如何从下拉边框底部中删除边框颜色?
问题描述
我正在尝试从下拉列表中删除边框颜色border-bottom: 1px solid rgba(0, 0, 0, 0.42);
当我调试时,我发现它来自这个类 MuiInput-underline-2593
但是 CSS 类MuiInput-underline-2593:before
来自框架。
你们能告诉我如何解决它。以便将来我可以自己修复它。在下面提供我的相关代码片段和沙箱链接
https://codesandbox.io/s/4x9lw9qrmx
MuiInput-underline-2593:before {
left: 0;
right: 0;
bottom: 0;
content: "\00a0";
position: absolute;
transition: border-bottom-color 200ms cubic-bezier(0.4, 0, 0.2, 1) 0ms;
border-bottom: 1px solid rgba(0, 0, 0, 0.42);
pointer-events: none;
}
<Select
className={classes.queryBuilderContainerItem}
classes={classes}
styles={selectStyles}
options={this.state.suggestions}
components={components}
value={this.state.single}
onChange={this.handleChange("network")}
placeholder="Search a to do"
/>
解决方案
基本上你可以删除它应该消失的整个 CSS 部分。
所以你的代码看起来像:
<Select
className={classes.queryBuilderContainerItem}
classes={classes}
styles={selectStyles}
options={this.state.suggestions}
components={components}
value={this.state.single}
onChange={this.handleChange("network")}
placeholder="Search a to do"
/>
推荐阅读
- html - 如何在边框中的链接之间添加间距
- python - 使用 DynamoDB 和 Lambda API 处理删除请求
- python - 如何在 BeautifulSoup 中使用 Python 仅打印这一行的日期?
- javascript - react-router - 从嵌套路由器导航到父路由
- vue.js - v-for in vue 更新数组中的所有对象,虽然键已经确定
- c# - PostgreSQL 让 CPU 使用率达到 100%?
- python - QVBoxLayout 文本在父级调整大小时被垂直剪切
- java - ForgeRock(用于 SSO)登录和注销的预期行为
- azure-devops - 在 Azure Dev 中格式化水平线
- android - 反应本机移动应用程序:获取最大调用堆栈大小超出错误