CSS 相对于浏览器窗口的宽度设置 div 的宽度
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14313738/
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
Set width of div relatively to width of browser window
提问by Chin
How can I set the widthproperty of a divso that it is always a percentage of the browser window's width?
如何设置 a 的width属性div，使其始终是浏览器窗口宽度的百分比？
For example,
例如，
- when the width of the browser window is 1920px, the
div's width is 1536px (80%) - when the width of the browser window is 1600px, the
div's width is 1280px (80%)
- 当浏览器窗口的宽度为 1920px 时，
div的宽度为 1536px (80%) - 当浏览器窗口的宽度为 1600px 时，
div的宽度为 1280px (80%)
and so forth?
等等？
采纳答案by Shrey Gupta
You should use a wrapper div and set it equal to 100% of the browser width, then put the desired div and set it to width:80%. This will allow you to center your desired div too. (use margin:0 autofor this.)
您应该使用包装 div 并将其设置为等于浏览器宽度的 100%，然后放置所需的 div 并将其设置为width:80%. 这也将允许您将所需的 div 居中。（margin:0 auto用于此。）
Here's a JSFiddle with a demo: http://jsfiddle.net/6Lwpr/
这是一个带有演示的 JSFiddle：http: //jsfiddle.net/6Lwpr/
回答by Kevin howbrook
vw: Relative to 1% of the width of the viewport
vw：相对于视口宽度的 1%
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_unit_vw
https://www.w3schools.com/cssref/tryit.asp?filename=trycss_unit_vw
回答by Pawan Lakhara
use this
用这个
.main
{width:100%;
margin-left:auto;
margin-right:auto;
}
.content
{
width:80%;
margin-left:auto;
margin-right:auto;
}
