为呈现的MDBootrap元素覆盖CSS

Question

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

<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和{ {1}}个元素。关于如何通过覆盖（或添加其他样式）来应用自己的CSS的任何想法？

Answer 1

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