如何？最小宽度，宽度和最大宽度（css）

Question

我的主要div设置为

max-width:600px;

但是，当内容不够长时，div将调整为内容的长度。这是有道理的。

所以我宣布：

  width:600px;
  max-width:600px;

但是现在，当您调整窗口大小时，div不会调整大小。我尝试设置最小宽度：

  min-width:200px;
  width:600px;
  max-width:600px;

但它仍然不会调整大小600px（在窗口调整大小时）;

那我错过了什么？我可以一起使用所有3个宽度设置吗？ （最小宽度，宽度，最大宽度）？

如果是这样，怎么样？我想了解逻辑。

我希望内容可以扩展到600px，但也可以调整窗口大小调整大小。

Answer 1

取出“width：600px”如果浏览器窗口足够大，div将为600 px，否则如果浏览器窗口小于600px，它将调整到最小宽度。

Answer 2

您可以使用媒体查询为特定屏幕尺寸应用宽度

.div {
    width: 600px;
}

@media screen and (max-width 600px) {
    .div {
        width: 100%;
    }
}

Answer 3

我想你想要

width: 600px;
max-width: 100%;

这样，元素将尝试宽度为600px。但如果父母不够宽，那就更少了。

Demo