<html>
<head>
<style type="text/css">
body{
background-color:#000;
background-image:url(../i/bck.gif);
font-family:"Helvetica Neue",Arial,sans-serif;
font-size:12px;
color:#fff;
height:100%;
margin:0;
}
#wrap{
min-width:1000px;
width:68%;
margin:0 16%;
height:100%;
background-color:red;
}
</style>
</head>
<body>
<div id="wrap">a</div>
</body>
</html>
编辑:
我现在稍微弄乱了代码，发现问题出在最小宽度处。如果你调整(变小)浏览器，你会看到它会在左边保持 16% 的边距，而宽度不再是 68%，而是 1000px，当浏览器窗口打开时可能会超过 68%更小。现在，问题是有人知道解决这个问题的方法吗？
示例 1: 浏览器宽度:2000 像素，div 宽度:68% -> 1360 像素，左右边距:各 16% -> 320 像素。
示例 2: 浏览器宽度:1200 像素，div 宽度:1000 像素(最小值)，左右边距:16% -> 各 192p。
示例 2 是问题所在。由于 68% 的浏览器小于 1000px，因此 div 的宽度为 1000px。 1000px + 192px + 192px 不等于浏览器的完整尺寸 1200px。
最佳答案
我刚刚测试了这个概念，它似乎按预期工作。
<div>foo</div>
和 CSS:
div { width: 80%; margin: 0 10%; }
你的选择器是一个id，除非div有id="div"，选择器必须改变。属性的大小写很重要。
关于html - CSS 最小宽度/边距百分比问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/8949239/