切片模板和设计布局，中心体内包装

Question

我有一个pdf模板，其布局如下面的示例pdf图像：

PDF的描述模板的整体尺寸是宽度1600 x高度1335像素（在示例图像中显示为绿色背景）在顶部它将有一个新闻/文本滚动，它将覆盖整个页面的宽度，但它的身体部分将更少（它是白色，灰色和黑色的区域）。

我想要的是？此布局可适用于最小1024 x 786像素和任何宽度的maixumum。

我该如何开发页面布局？

固定外绿箱宽度和内箱宽度？百分比都是？或任何固定的和其他百分比？

Answer 1

你想要的基本想法是一个100％宽度的body元素和一个宽度为1024 px的容器。将margin-left和margin-right设置为auto会将它们置于父体中心。这符合您的基本要求。

body
{
    text-align: center;
    width: 100%;
}

#container
{
    margin-left: auto;
    margin-right: auto;
    width: 1024px;
    min-height: 768px;
    text-align: left;
}