CSS 宽度 100% 或最大宽度(以像素为单位)
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/5675637/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS width 100% OR max-width in pixels
提问by Mikko Ohtamaa
How one could create a CSS rule for width which
如何为宽度创建一个 CSS 规则
Uses 100% width by default
If 100% width exceeds certain pixel width (let's say 512 px), then the width is clamped down to this pixel width
默认使用 100% 宽度
如果 100% 宽度超过特定像素宽度(假设为 512 像素),则宽度将被限制为该像素宽度
I am not sure about width and max-width relations, or how calc() is supported or could express this. This would need to work with the latest WebKit browsers and Firefox 4. IE8 etc. support not needed
我不确定宽度和最大宽度的关系,或者如何支持 calc() 或如何表达这一点。这需要使用最新的 WebKit 浏览器和 Firefox 4。不需要 IE8 等支持
回答by BoltClock
That's in fact the intended use of max-width
. If the computed (actual) width
of an element exceeds max-width
, it will be constrained to the max value instead of going beyond it. Percentage versus pixels isn't relevant.
这实际上是max-width
. 如果width
元素的计算(实际)超过max-width
,它将被限制为最大值而不是超出它。百分比与像素无关。
Declare both in the same rule like this (no need for the calc()
function):
像这样在同一规则中声明两者(不需要calc()
函数):
#somediv {
width: 100%;
max-width: 512px;
}
回答by clairesuzy
If it's block level element it should be 100% by default so no need to declare the width, then max-width: 512px;
would curtail it
如果它是块级元素,默认情况下应该是 100%,所以不需要声明宽度,然后max-width: 512px;
会缩减它
calc()
is not supported very well at all, but in this case I wouldn't think you would need it
calc()
根本没有得到很好的支持,但在这种情况下,我认为您不需要它
回答by Ian Wood
div{ max-width: 512px; }
should suffice.
应该足够了。