制作圆形的模态

Question

我想创建一个圆形的模态而不是圆角的常规矩形.所以看起来应该只是一个圆形的modal-body中间,没有modal-header和没有modal-footer.

这是用模态来确定它是如何工作的,而不是常规的html圈.

我只是希望它看起来像这样.

Answer 1

你需要在模态中试验内容的位置,但这是我刚刚使用的一个工作示例border-radius:https://jsfiddle.net/2ahhsa4a/1/

.modal-content {
    border-radius: 50%;
    width: 600px;
    height: 600px;
    border: 15px solid #000;
}

您会注意到我使用了固定width/ height用于模态,这是为了确保它与border-radius本例结合使用时是一个完美的圆.