为什么css样式不适用于模态？

Question

由于某种原因，css样式不适用于React Modal。有什么理由吗？

render() {
    return (
      <div>
        <Modal defaultOpen={this.props.isShowing} className="openmodal">
        </Modal>
      </div>
    );
}

CSS文件

.openmodal{
  text-align: center;
  background-color: black;
  border-radius: 0;
  width: 400px;
  position: relative;
}

Answer 1

如果你想使用javascript样式，你可以像这样应用它;

＆＃13;

＆＃13;

const openmodal = {
  content: {
    textAlign: 'center',
    backgroundColor: 'black',
    borderRadius: '0',
    width: '400px',
    position: 'relative'
  }
}

render() {
    return (
      <div>
        <Modal defaultOpen={this.props.isShowing} style={openmodal}>
        </Modal>
      </div>
    );
}

＆＃13;

＆＃13;

＆＃13;

尝试使用内联样式。

Answer 2

它应该是portalClassName：

            random
2018-01-01       1
2018-01-02      13
2018-01-07      26

Answer 3

它带有自己的DOM结构和自己的类集。

所以您必须在屏幕截图中定位这些类