设置默认宽度和最小宽度属性

Question

我在对话框中显示图像，图像大小不一，最小宽度图像为500像素，大部分图像宽度大于800像素。

.modal-dialog { min-width:500px; }

如何应用css属性，使得如果图像宽度为500px或者不超过800px，则容器对话框.modal-dialog的宽度会减小到图像宽度，但对于大小超过800px的其他图像，则保持固定为800px。

同样建议如何为身高做这件事。

Answer 1

将以下属性添加到容器.modal.dialog：

.modal_dialog {
  display: inline-block;
  width: auto;  
  min-width: 500px;
  max-width: 800px;
}

max-width和max-height将容器限制为所需的尺寸，并将显示设置为inline-block，宽度设置为auto，将容器宽度调整为图像宽度它介于500px和800px之间。

Answer 2

.modal_dialog img{
  display: inline-block;
  width: auto;  
  min-width: 500px;
  max-width: 800px;
}

现在您为该图像设置了高度