如何设置我的博客以便指定每个元素的大小？

Question

我希望我的网页看起来像这样但是我不确定我会限制每个元素的方式，即标题，内容，导航和页脚，以便它们如下图所示排列？

我会指定最大宽度等吗？

Answer 1

我假设你正在使用div？

如果是这样的话：

#header{
    width: 100%;
}

#navigation{
    width: 30%; // example
    float: left;
}

#content{
   width: 70%; // example, navigation and content must = 100
   float: left;
}

#footer{
   width: 100%;
}

除非你想确保导航是页面宽度的30％，除非那会使它小于200px，否则你不需要指定min-max-然后你会使用：

#navigation{
    width: 30%; // example
    min-width: 200px;
    float: left;
}

Answer 2

试试这个：

<style type="text/css">
            table
            {
                width: 100%;
                border:1px solid black;
            }
            .col1
            {
                width: 25%;
                border-right:1px solid black;
            }
            .col2
            {
                width: 75%;
            }
            .header
            {
                border-bottom:1px solid black;
            }
            .footer
            {
                border-top:1px solid black;
            }
    </style>

    <table>
            <tr>
                <td colspan="2" class="header">
                    header
                </td>
            </tr>
            <tr>
                <td class="col1">
                    col1
                </td>
                <td class="col2">
                    col2
                </td>
            </tr>
            <tr>
                <td colspan="2" class="footer">
                    footer
                </td>
            </tr>
        </table>