CSS最小宽度固定和百分比
[英]CSS min-width fixed and percentage
问题描述
I'm wondering if I can have a section to have min width both as percentage and a fixed amount. 
我想知道我是否可以让一个部分具有最小宽度和百分比和固定数量。 Let me be more clear, I have the following html: 让我更清楚，我有以下html：
<body>
<main>
<section id="home-section">
...Content...
</section>
<section id="team-section">
...Content...
</section>
</main>
</body>
I have 我有
section{
min-width: 100%;
}
Is there a way to have min-width as both: 100% and 600px? 有没有办法让min-width同时为：100％和600px？ So that if the viewport is less than 600px the width its 600px and if its more the min-width its 100%? 因此，如果视口小于600px宽度为600px，如果它的最小宽度为100％？ (It can be more because of content) （因为内容可能更多）
3 个解决方案
解决方案1
6 已采纳 2016-10-19 15:36:33
You only have to do this: 你只需这样做：
section {
min-width: 600px;
}
it is automatically 100%, with a minimum of 600px. 它自动100％，最小600px。
解决方案2
4 2016-10-19 15:33:14
The usual way is a bit different. 通常的方式有点不同。 You define for example: 您可以定义例如：
width: 100%
max-width: 600px;
That way it will have the full width in smaller viewports, but never grow beyond 600px 这样它将在较小的视口中具有全宽，但永远不会超过600px
PS: You wrote PS：你写的
So that if the viewport is less than 600px the width its 600px
That way it would be wider than the viewport on smaller screens - I suppose this isn't what you want, is it? 那样它会比小屏幕上的视口更宽 - 我想这不是你想要的，是吗？
解决方案3
1 2016-10-19 15:33:11
Just specify a width: 600px; 只需指定width: 600px; with your min-width and you should get what you're looking for. 你的min-width ，你应该得到你想要的。
This will make the section's 100% when the width is greater than 600px, and 600px when it is less than 600px, which is what you requested. 当宽度大于600px时，这将使截面为100％，当小于600px时，这将使截面为100px，这是您所要求的。
CSS CSS
section {
min-width: 100%;
width: 600px;
}
section { min-width: 100%; width: 600px; background-color: yellow; }
<main> <section id="home-section"> ...Content... </section> <section id="team-section"> ...Content... </section> </main>
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.