javascript - 为呈现的 MDBootrap 元素覆盖 CSS

Question

我正在使用 MDBoostrap（类似于 Bootstrap）在 React 应用程序中设置我的元素样式。现在我有一个选择元素，如下所示。

<div>
    <select id="Regions" style={errorSelect} value={this.state.userRegionId} onChange={this.handleRegionChange}>
      {this.handleGetRegions()}
    </select>
</div>

当它渲染时，它会生成一些这样的 HTML。

我试着做这样的事情。

//...
const errorSelect = {
  borderBottom: '2px solid #FF0000'
};
//...
<select id="Regions" className={errorSelect} value={this.state.userRegionId} onChange={this.handleRegionChange}>
  {this.handleGetRegions()}
</select>
//...

如您所见，即使我在我的 React 代码中应用className或style元素，它也不会影响，因为主 UI 被渲染/翻译为input元素ul。关于如何通过覆盖（或添加额外样式）来应用我自己的 CSS 的任何想法？

Answer 1

您可以通过在 css 行的末尾添加“！important”来强制使用自己的 css。并且必须在MDBootstrap 的css 文件之后导入自己的css 文件。希望我能帮上忙。