仅对特定模态施加特定属性答案

【问题标题】：impose Specific property to particular modal only仅对特定模态施加特定属性
【发布时间】：2022-01-01 15:40:23
【问题描述】：

我想制作一个模态，默认情况下模态的大小很小，所以我使用 modal-content 类来增加它的高度和宽度，但是这个规范是给项目中自动使用的所有模态但我想要这个模态的大小只有。

import Modal from 'react-bootstrap/Modal';

<Modal show={show} onHide={handleClose}>
                <Modal.Header closeButton>
                    <Modal.Title>Map</Modal.Title>
                </Modal.Header>
                <Modal.Body>
                    <MapsDataCollection/>
                </Modal.Body>
            </Modal>

CSS

.modal-content{
    height:35em !important;
    width:130% !important;
}

【问题讨论】：

标签： css reactjs modal-dialog bootstrap-modal react-bootstrap

【解决方案1】：

来自 React Bootstrap -- 模态

https://react-bootstrap.github.io/components/modal/#modal-props

尝试在Modal 上编辑 size 属性可能会有所帮助

【讨论】：

使用大小标题变大而不是正文部分

【解决方案2】：

使用 contentClassName="custom-modal-style" 并在此类中进行更改

<Modal 
                    contentClassName="custom-modal-style"
                    show={show} onHide={handleClose}>
                    <Modal.Header closeButton>
                        <Modal.Title>Map</Modal.Title>
                    </Modal.Header>
                    <Modal.Body>
                        <MapsDataCollection/>
                    </Modal.Body>
                </Modal>

【讨论】：

正如目前所写，您的答案尚不清楚。请edit 添加其他详细信息，以帮助其他人了解这如何解决所提出的问题。你可以找到更多关于如何写好答案的信息in the help center。