Question

项目的一部分是创建一个网页/主页。我试图将我的文章部分分为两部分。现在，我在谷歌中搜索了如何将网站划分为两个部分/多个部分。我知道它可以通过使用框架完成，但我想使用div。

这是我的html和css代码的一部分。

<div id="mainArticle">
    <section class="section">
        <p>Information</p>
    </section>
    <aside class="aside">
        <p>sidebar1</p>
        <p>sidebar2</p>
    </aside>
</div>

此代码的CSS部分：

#mainArticle {
    clear:all;
    background-color:#ABBCDE;
    width:1000px;
    height:200px;
}
.aside {
    float:left;
    margin: 20px 0px 20px 0px;
    ;
    width:50%;
    background-color:yellow;
    height:50px;
}
.section {
    float:right;
    width: 50%;
    margin:20px 5px 20px 0px;
    background-color:cyan;
    height: 120px;
}

Answer 1

您的边距通过添加额外的间距而放弃了width: 50%。尝试删除边距。

这是理想的结果吗？

#mainArticle {
    clear:all;
    background-color:#ABBCDE;
    width:1000px;
    height:200px;
}
.aside {
    float:left;
    width:50%;
    background-color:yellow;
    height:50px;
}
.section {
    float:right;
    width: 50%;
    background-color:cyan;
    height: 120px;
}

使用div标签划分网页

1 个答案: